Question

真的是新来的本地反应。尝试实现以下应用流程：

应用启动-> AuthToken检查-> ProfileData检查->主应用

对于AuthToken检查： -如果令牌存在，请将其附加到标题中以供将来请求 -如果没有令牌，请重定向到登录页面，成功登录后会将令牌存储在SecureStore中，然后将其附加到标头中以供将来请求

对于ProfileData检查： -如果没有ProfileData，则发出API请求，写入存储，然后传递给Main应用 -如果存在ProfileData，请对其进行检索并传递给主应用

我目前正在使用react-native-router-flux来加载基本上运行此功能的AuthCheck组件：

    async componentWillMount() {
        await this.tokenCheck();
    }
    async tokenCheck(){
        console.log("Checking for token..");
        let token_exist = await SecureStore.getItemAsync("AuthToken");
        if(!token_exist) {
            Actions.auth();
        }else{
            Actions.main();
        }
    }

如果要在每个页面上运行此代码，应将其放在哪里？我该在哪里放置用于检索个人资料详细信息的代码？

Answer 1

您甚至使用过react navigation吗？

这是如此易于使用和学习，我强烈推荐给您。它也有很好的文档

这是一种简单的方法，可以首先检查身份验证，还将令牌保存在AsyncStorage中，并将其作为道具传递给其他路由：

export default mainNavigation = createSwitchNavigator(
  {
    AuthLoading: AuthLoadingScreen,
    Home: HomeStack ,
    SignIn: SignInScreen ,
    Verification: VerificationScreen,
  },
  {
    initialRouteName: 'AuthLoading',
  }
);

您会看到AuthScreen是初始路线

在AuthScreen中，您必须检查AsyncStorage是否存在令牌，然后如果令牌无效或不存在则验证此令牌，将用户导航到SignInScreen的用户，然后在此处可以在AsyncStorage中设置令牌参数

对于HomeScreen，您应该使用createStackNavigator来传递令牌作为道具

React Native：试图理解路由逻辑

1 个答案: