reactjs - 反应本机异步存储无法正常工作

Question

我的 react native app 中有 2 个导航器。

我正在尝试有条件地在 App.js 中使用它们

我在我的一个屏幕中设置了项目，然后我正在尝试这样做

  export default function App() {
  const logedStatus = AsyncStorage.getItem('logedIn').then(logedIn => logedIn)
  return (
    <Provider store={store}>
      {logedStatus.length === 0 ? <Navigator /> : <LogedInNav/>}
      <Snackbar />
    </Provider>
  );
}

无论我尝试启动应用程序多少次，它总是呈现logedInNav导航，我很困惑，如果你不自己清除它，商店永远不会空吗？还是我做错了什么？

标签： reactjs

Answer 1

你需要使用 state 和 useEffect

 import {useState,useEffect} from 'react'
 export default function App() {
   const[logedStatus,setlogedStatus])useState(false)
  useEffect(()=>{
     let mounted=true;
      AsyncStorage.getItem('logedIn').then(logedIn =>{
             if(mounted) setlogedStatus(logedIn)
       })
      return()=>{mounted=false;}
  },[])

  return (
    <Provider store={store}>
      {logedStatus.length === 0 ? <Navigator /> : <LogedInNav/>}
      <Snackbar />
    </Provider>
  );
}