如何在 React Native 中的 LocalStorage 中存储值答案

【问题标题】：How to store value in LocalStorage in React Native如何在 React Native 中的 LocalStorage 中存储值
【发布时间】：2022-02-17 17:06:08
【问题描述】：

我是 React Native 的新手，我正在创建一个应用程序，我需要在其中将值存储在本地存储中，例如 Android 中的 SharedPref 。

例如：如果用户已登录，则控制应转到仪表板，否则应出现登录屏幕

提前谢谢你

【问题讨论】：

能否请您标记正确的答案？谢谢！

标签： react-native

【解决方案1】：

有几种方法可以做这样的事情。

对于大多数基本的事情，您可以使用 react-native 中的 AsyncStorage，但还有其他选项，例如 Realm 和 SQLite，它们是用于在设备上存储数据的库。

如果你使用Redux，你也可以使用redux-persist。

编辑

正如@honor 所说，您应该使用react-native-community/react-native-async-storage 而不是此处引用的旧 AsyncStorage（已弃用）

【讨论】：

【解决方案2】：

对于仍在寻找此内容的任何人，RN async storage 已被弃用。您可以改用：https://github.com/react-native-community/react-native-async-storage。

【讨论】：

可以和Expo一起使用吗？
@NikolaMihajlović, AsyncStorage 可以与 Expo 一起使用。
RN 的默认值是，替换 react-native-async-storage（由这个答案建议）仍然没有，不幸的是。

【解决方案3】：

你可以使用sync storage，它比异步存储更容易使用：

import SyncStorage from 'sync-storage';

...

SyncStorage.set('foo', 'bar');

const result = SyncStorage.get('foo');
console.log(result); // 'bar'

【讨论】：

【解决方案4】：

AsyncStorage 是存储一些您可以使用的数据的最佳选择，如下例所示：

AsyncStorage.setItem('access_token', responseData.data.access_token);

这是我的单独组件，您可以在其中创建单独的函数以在任何地方导入示例：

export const isSignedIn = () => {
  return new Promise((resolve, reject) => {
    AsyncStorage.getItem(USER_KEY)
      .then(res => {
        if (res !== null) {
          resolve(res);
        } else {
          resolve(false);
        }
      })
      .catch(err => reject(err));
  });
};

如何导入？

import { isSignedIn, url } from "./Auth";

isSignedIn()
    .then(res => {
      this.changeLoaderStatus();
      if(res){
        res; //this is your token 
      }
    }

您将从以下 URL 获取包：

https://github.com/react-native-async-storage/async-storage

【讨论】：

【解决方案5】：

你不能在 React-Native 中使用 LocalStorage，你可以使用 AsyncStorage 代替。

编辑：您也可以使用redux 之类的商店来处理此问题。

【讨论】：

在 Redux 上的 Store 上保存数据只是暂时的。
@BrayanLoayza 你可以使用 redux-persist 来保持你的 redux 状态或者使用这个列表中的一个存储引擎来保持你的 redux 状态：github.com/rt2zz/redux-persist#storage-engines
你认为使用 redux-persist 会比 realm db 好很多？

【解决方案6】：

不要使用 AsyncStorage，因为 Android 上有很多错误，而且 RN 团队似乎没有任何兴趣修复它（这样已经好几年了）。

简而言之：不要使用 AsyncStorage

【讨论】：

那么，用什么？
我使用 Redux 和 Redux-Persist 中间件。
@Spock redux-persist 使用 AsyncStorage
还是这样吗？

【解决方案7】：

来自反应原生文档：

AsyncStorage 已弃用。

建议使用 react-native-async-storage。

文档链接：https://facebook.github.io/react-native/docs/asyncstorage.html

希望你清楚。

【讨论】：

【解决方案8】：

根据官方docAsyncStorage 已被弃用，现在将使用@react-native-community/async-storage
所以，请按照以下步骤使用AsyncStorage

纱线添加@react-native-community/async-storage

cd ios/ && pod install (仅适用于IOS)

存储数据

import { AsyncStorage } from 'react-native';

storeData = async () => {
  try {
    await AsyncStorage.setItem('@storage_Key', 'stored value')
  } catch (e) {
    // saving error
  }
}

读取数据

getData = async () => {
  try {
    const value = await AsyncStorage.getItem('@storage_Key')
    if(value !== null) {
      // value previously stored
    }
  } catch(e) {
    // error reading value
  }
}

【讨论】：

【解决方案9】：

使用异步存储

并执行所有本地存储操作，例如在 react native 中获取和设置值

【讨论】：