Question

我的路由器就是这个。有没有一种方法可以告诉变量显示什么屏幕？

export const HomeNavigator = TabNavigator({
    ...
    Search:{
        screen: usertype == 1? Customer : Handyman,
    },
    ...
});

export const RootStack = StackNavigator({
    Login: {screen: Login}
    Home:{screen: HomeNavigator},
    ...
},{
    headerMode: 'none'
});

export default RootStack;

用户登录后，应用程序将检查其帐户类型。然后，他的帐户类型将告知搜索标签中应显示的屏幕：

如果用户的帐户类型为1 ，则应显示的屏幕为 customer.js

如果用户的帐户类型为2 ，则应显示的屏幕为 Handyman.js

Answer 1

我将向您展示我的包裹的工作流程，并随时询问您是否仍然感到困惑，

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以检查记录了哪个帐户：

..import

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

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

以及app.js或index.js：

..import check variable from router.js

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

TabNavigator中的条件屏幕

1 个答案: