存储在AsyncStorage中时的反应导航清除数据-如何查看数据？

Question

我正在使用反应导航底部选项卡，当我将数据存储在AsyncStorage中时，进入此SavedData组件时，数据显示为空。在控制台中，如果我输入showAsyncStorageContentInDev()，则表明我确实拥有密钥@storage_key。但是当我控制台注销数据时，它始终为空。它与反应导航底部选项卡上的数据已空有关吗？

或者当用户将标签切换到该组件时如何查看数据？

const SavedData = (props) => {
  const [getData, setData] = useState([]);

  const getKeyInfo = async () => {
    try {
      const storedData = await AsyncStorage.getItem('@storage_Key');
      setData(JSON.parse(storedData))
      console.log('saved',getData);
    } catch (e) {
      // saving error
    }
    console.log(getData);
  };

  useEffect(() => {
    console.log(getData);
    getKeyInfo();
  }, []);

  return (
    <View>
      <Text>
        {getData.map((i, index) => (
          <View key={i.id.toString()}>
            <Data uri={i.uri} />
          </View>
        ))}
        ;
      </Text>
    </View>
  );

};

export default SavedExercise;

Answer 1

您是否曾尝试将getData传递到useEffect的第二个参数中，以在状态更改时通知组件重新渲染：

useEffect(() => {
    console.log(getData);
    getKeyInfo();
}, [getData]); // Here