在 React Native 中安装 AsyncStorage

在 React Native 开发中，我们有时需要在本地存储数据，例如用户信息、应用配置等。AsyncStorage 是 React Native 提供的一种跨平台的轻量级存储方案，可以帮助我们轻松地在应用程序中存储和检索数据。

本文将介绍如何在 React Native 中安装和配置 AsyncStorage。

步骤

1. 安装 AsyncStorage

在终端中使用以下命令安装 AsyncStorage：

npm install @react-native-async-storage/async-storage

或者使用 yarn：

yarn add @react-native-async-storage/async-storage

2. 链接原生模块

在 React Native 0.60 及以上版本中，React Native CLI 默认会使用自动链接功能，所以不需要手动链接原生模块。

如果您的应用程序版本较低，请使用以下命令手动链接原生模块：

react-native link @react-native-async-storage/async-storage

3. 使用 AsyncStorage

在您的 React Native 项目中导入 AsyncStorage：

import AsyncStorage from '@react-native-async-storage/async-storage';

然后，您可以使用以下方法存储数据：

try {
  await AsyncStorage.setItem('@app_data:key', 'value');
} catch (error) {
  console.log(error);
}

使用以下方法检索数据：

try {
  const value = await AsyncStorage.getItem('@app_data:key');
  if (value !== null) {
    console.log(value);
  }
} catch (error) {
  console.log(error);
}

4. 配置 iOS 应用

如果您的应用程序是运行在 iOS 上的，您还需要在您的应用程序的 Info.plist 文件中添加以下代码：

<key>NSAppTransportSecurity</key>
<dict>
  <key>NSAllowsArbitraryLoads</key>
  <true/>
</dict>

这是因为 iOS 默认情况下禁止应用程序通过“不安全”的 HTTP 连接访问网络资源。上述代码将允许应用程序通过这类连接访问网络资源。

结论

AsyncStorage 是 React Native 中很好用的数据存储方案，能够帮助我们简化应用程序的本地存储操作。本文介绍了安装和配置 AsyncStorage 的步骤，希望能够对您有所帮助。