【问题标题】:Can a stack navigator have 2 different routes in react navigation堆栈导航器可以在反应导航中有 2 条不同的路线吗
【发布时间】:2018-07-11 20:16:57
【问题描述】:

我的项目结构如下:

Tab navigator
|-Tab1
|-Tab2
    |-stack navigator
          |-login
              |
             screen1
              |
             screen2
               |
             screen3
|-Tab3
|-Tab4

一旦我输入登录屏幕的用户名和密码,我希望我的堆栈导航器路由从 screen1 开始。我们有什么办法可以做到这一点? 我们可以重新路由/更改堆栈导航器的路由吗?

【问题讨论】:

标签: react-native react-navigation stack-navigator


【解决方案1】:

使用SwitchNavigator 更改/重新路由屏幕堆栈

我没有使用 React Navigation V2,如果您需要有关 RNV2 的更多信息,请查看文档

这是一个例子TODO

在 router.js 中(处理屏幕):

const Tab =  TabNavigator({
  Customer : {
    screen: Customer,
  }
});

const TabLogged =  TabNavigator({
  Handyman: {
    screen: Handyman,
  }
});
// here's the key to handle which account is logged
export const Check = SwitchNavigator({
  Auth: Auth,
  Account1: Tab,
  Account2: TabLogged
})

创建 Auth.js 以检查是否记录了哪个帐户:

class foo extends React.component{
  componentWillMount(){
    this.props.navigation.navigate(usertype == "isLoggedIn" ? 'Account2' : 'Account1');
  }

  render(){
    <View>
      <ActivityIndicator size="large" color="#0000ff" />
      <StatusBar barStyle="default" />
    </View>
  }
}

在你的 app.js 或 index.js 中:

class app extends Component{
  render() {
    return <check/>;
  }
}

【讨论】:

    猜你喜欢
    • 2020-01-28
    • 2018-03-09
    • 1970-01-01
    • 1970-01-01
    • 2022-12-05
    • 1970-01-01
    • 2019-07-16
    • 2020-07-14
    • 1970-01-01
    相关资源
    最近更新 更多