时间戳

首页 > 解决方案 > React Native 中 AsyncStorage 的顶级等待

react-native - React Native 中 AsyncStorage 的顶级等待

问题描述

我正在尝试在我的 react native 和 expo 环境中实现顶级等待，以便我可以从中提取数据AsyncStorage并将其存储在一个变量中以在我的应用程序中全局使用。

我在安卓模拟器上运行该应用程序。我想要做的就是获取数据并在我的应用程序中使用它，但是当在异步函数外部调用时，该变量总是返回一个空对象。AsyncStorage在完成加载数据之前，它似乎对变量应用了一个值。

async function getData(){
  try {
    const value = await AsyncStorage.getItem('redditInsights')
      console.log('----------- getStore insights ---------')
      const insights = JSON.parse(value)
      console.log(insights) //  -------------> returns desired data
      return insights

  }
  catch (error) {
    console.log(error)
  }
}

const outsights = getData()
console.log("-------------------- outsights---------------------")
console.log(outsights) // ----------------------> returns empty object

我知道我可以在异步函数中提取数据，但是除了异步函数之外，我不能在任何地方使用该数据。我无法在函数外部调用 async 中声明的变量，而不会在数据被拉出之前尝试将值应用于变量。

理想情况下，我只需将数据存储到一个变量中，以便在我想要的任何地方使用，而无需像这样的异步函数，但这需要顶级等待支持：

 const value = await AsyncStorage.getItem('redditInsights')
 const insights = JSON.parse(value)

我尝试通过npm start 处的众多标志（ --harmony-top-level-await, --experimental-repl-await, ）实现顶级等待，如下所示：无济于事。我还升级到应该支持顶级等待，但我仍然收到错误消息。--experimental-top-level-awaitnpm start --flagnode v14.15.1

如何在我的 react native 和 expo 环境中实现顶级等待，以便我可以使用我的数据AsyncStorage

或者如果有人知道更好的方法来获取我的数据AsynStorage，我非常愿意尝试！

标签： react-nativeasync-awaitexporeact-native-androidasyncstorage

解决方案

简单的答案是这是不可能的。

这里有一个关于 react-native 中顶级等待的更详细的答案，它说 React Native 不符合顶级等待的要求（使用节点模块而不是 ECMAScript 原生模块）。

但是您的代码示例有一个错误，您可以声明一个顶级变量insights并将异步数据的结果分配给它。你的错误是使用getData你需要声明一个顶级变量的返回值，let然后将结果分配给它（所以而不是）你会在 a 之后return insights做类似的事情。topScopeInsights = insightslet topScopeInsights

但是，这没有任何意义，因为您不知道数据是否已经到达。该应用程序将使用您的变量启动undefined，然后您需要检查它是否已到达。这就是诺言的用途。

所以，回到我原来的答案，这是不可能的。:-(

推荐阅读