Question

我正在使用react-native-router-flux v4，这是我的路由器组件：

const RouterComponent = () => {
  return (
    <Router>
      <Scene key="root">
        <stack key="auth">
          <Scene
            key="login"
            component={LoginForm}
            title="Please Login"
          />
        </stack>
        <stack key="main">
          <Scene
            key="RestaurantListing"
            component={RestaurantListing}
            title="Restaurants available"
          />
        </stack>
      </Scene>
    </Router>
  )
};

当我去main时，我看到“RestaurantListing”组件，但我仍然看到顶部导航中的后箭头（＆lt ;-)？

我不希望用户能够返回认证页面，我该怎么做？

Answer 1

您应该首先将hideNavBar作为道具添加到场景RestaurantListing中，或者如果main的所有子级都不会使用导航栏，则可以将其添加到main中。您还需要从“ react-native-router-flux”导入ActionConst并将main的类型prop设置为ActionConst.RESET，这将重置堆栈，从而从后堆栈中删除您的身份验证页面。

import { Scene, Router, ActionConst } from 'react-native-router-flux';

const RouterComponent = () => {
  return (
    <Router>
      <Scene key="root">
        <stack key="auth">
          <Scene
            key="login"
            component={LoginForm}
            title="Please Login"
          />
        </stack>
        <stack key="main" type={ActionConst.RESET}>
          <Scene
            key="RestaurantListing"
            component={RestaurantListing}
            title="Restaurants available"                
            hideNavBar
          />
        </stack>
      </Scene>
    </Router>
  )
};

如何在react-native-router-flux中更改root？

1 个答案: