如何使用 async/await 通过函数从 react native 中的 AsyncStorage 中检索值

Question

我创建了prefsManager.js - 用于从 AsyncStorage 存储和检索数据，但我遇到了一个问题，例如当打印日志时它返回总是未定义，因为它是异步的，但我想通过调用函数来打印日志中的实际值。

import { AsyncStorage } from 'react-native';
import prefskey from '../utils/constants/prefskeys';
const setValue = async (key, value) => {
    await AsyncStorage.setItem(key, value);
}
const getValue = async (key) => {
    let value = '';
    try {
        value = await AsyncStorage.getItem(key) || 'none';
    } catch (error) {
        // Error retrieving data 
        console.log(error.message);
    }
    return value;
};
const prefsmanager = {
    setValue,
    getValue
}
export default prefsmanager; 

我在家里用过这个.js当按下按钮时，我正在调用这种方法。

_handlePress() {
        await prefsManager.setValue(prefskey.username, this.state.username)
        console.log("username =>>", await prefsManager.getValue(prefskey.username)); 
     }

Answer 1

你需要像这样在函数上使用 async 关键字。

    import { AsyncStorage } from 'react-native';
import prefskey from '../utils/constants/prefskeys';
const prefsnamager = {
    setValue: function (key, value) {
        AsyncStorage.setItem(key, value)
    },
    getValue: async (key) => {
        let value = '';
        try {
            value = await AsyncStorage.getItem(key) || 'none';
        } catch (error) {
            // Error retrieving data
            console.log(error.message);
        }
        return value;
    }
}
export default prefsnamager;

调用函数

_handlePress = () => {
        prefsManager.setValue(prefskey.username, this.state.username)
        console.log("username =>>" , prefsManager.getValue(prefskey.username));
     }

Answer 2

1. 在存储中设置值

AsyncStorage.setItem('data','Read Data')

2. 从存储中获取价值

constructor(props) {
    super(props)       
    this.state = {};
    let self=this;
    //this function is called everytime , when you visit this screen.
    this.__didFocusSubscription = this.props.navigation.addListener('didFocus',payload => {
        AsyncStorage.getItem('data').then((value)=>{
            if(value==null){
                self.setState({count:'no data found'})
            }
            else{
                self.setState({count:value})
            }
        })
    });       
}

Answer 3

实际上，它就像网络上的localStorage，但略有不同。 在获取项目时，它会异步执行。 注意以下事项：

AsyncStorage.setItem('key', value);

但是在得到它时，如下所示：

AsyncStorage.getItem('key')
  .then( value => console.log(value) );