在本机反应中有条件地设置初始路由

Question

我正在 React Native 中构建一个移动应用程序，其身份验证过程类似于 Whatsapp.I 如果 [=13] 中没有令牌，我想将 initialRoute 设置为 'Signup' =] and dashboard if token is present.I 用下面的代码尝试了这个，但它总是指向 dashboard 即使 AsyncStorage.[=18 中没有标记=]

抽屉

import { AsyncStorage } from 'react-native'
import Signup from '../screens/SignupScreen'
import CustomDrawer from './CustomDrawer'

const DrawNavigator = createDrawerNavigator({
  Dashboard: { screen: Home },
  Signup: { screen: Signup},
  },{
  initialRouteName: AsyncStorage.getItem('token') ? 'Dashboard' : 'Signup',
contentComponent: CustomDrawer,
drawerOpenRoute: 'drawerOpen',
drawerCloseRoute: 'drawerClose',
drawerToggleRoute: 'drawerToggle'});

export default DrawNavigator;

编辑

async function checkToken(){
  var token = await AsyncStorage.getItem('token')
  return token ? true : false
}

initialRouteName: checkToken()  ? 'Dashboard' : 'Signup',

但即使没有存储令牌，该应用仍然可以访问 Dashboard

Answer 1

Asyncstorage.getItem() 是一个异步调用。所以你必须使用异步等待。

Answer 2

AsyncStorage 异步工作，因此在您的条件下解释的表达式是 getItem 函数生成的 Promise 对象。

您可以尝试使用 await 语句来阻止执行，直到您知道是否有令牌。不推荐这样做，因为您会阻止应用程序的初始化。

您也可以尝试使用一个默认路由来检查 componentDidMount 中的令牌，然后根据结果进行重定向。

旁注：从 "react-native" 导入的 AsyncStorage 现已弃用，并将在 React-Native 的未来版本中删除。考虑改为安装 "@react-native-community/async-storage"。

在本机反应中有条件地设置初始路由

Set initial route conditionally in react native

react-native

asyncstorage