Question

我试图在我的React Native应用程序中从AsyncStorage获取一个值，但是它首先以空字符串的形式出现。

让我说我有2个组成部分，首页和关于。

关于屏幕是我获取AsyncStorage值的地方。

我能够使用createBottomTabNavigator在屏幕底部创建导航标签，以便可以在“首页”和“关于”之间切换。

当我按下“关于”屏幕时，我试图控制台记录该值，但它只是一个空数组。如果我像这样使用钩子（或useEffect）：

const [data, setData] = useState([])

const asyncFunctionData = async () => {
  try {
    const storageData = await AsyncStorage.getItem('key_data');
    setData(JSON.parse(storageData));
    console.log(data);
  } catch (e) {}
}

useEffect(() => {
  asyncFunctionData();
}, [data]);

由于某种原因，该组件将连续执行，但是经过几次执行，我终于可以得到AsyncStorage的值。但是问题是为什么它要执行多次，为什么我一开始会得到一个空数组？我认为拥有[]只会执行一次useEffect或在有更新时执行。

AsyncStorage对连续执行有某种影响吗？另外，AsyncStorage不会在应用程序加载时获得任何价值吗？

Answer 1

您的钩子不依赖于从AsyncStorage获取值后设置的数据，还应该在useEffect内定义异步函数

const [data, setData] = useState([])

useEffect(() => {
 const asyncFunctionData = async () => {
   try {
     const storageData = await AsyncStorage.getItem('key_data');
     setData(JSON.parse(storageData));
   } catch (e) {}
 }
 asyncFunctionData();
}, [setData]);`

AsyncStorage如何与React Navigation一起使用？

1 个答案: