React Native 中的 AsyncStorage.getItem 未按预期工作答案

【问题标题】：AsyncStorage.getItem in react native not working as expectedReact Native 中的 AsyncStorage.getItem 未按预期工作
【发布时间】：2018-05-05 17:21:09
【问题描述】：

我正在尝试使用 AsyncStorage 获取数据。每当我调用我的动作创建者 requestData 并对传递的数据进行控制台时，我都会得到如下所示的内容。我有两个版本的 getItem 。在这两个版本中，我都得到了属性字段的无用值。属性值应该是可读的

{"fromDate":"20160601","toDate":"20160701","property":{"_40":0,"_65":0,"_55":null,"_72": null},"url":"/abc/abc/xyz"}

 async getItem(item) {
  let response = await AsyncStorage.getItem(item);
  let responseJson = await JSON.stringify(response);
  return responseJson;
}


async getItem(item) {
  try {
    const value =  AsyncStorage.getItem(item).then((value) => { console.log("inside componentWillMount method call and value is "+value);
    this.setState({'assetIdList': value});
     }).then(res => {
    return res;
  });
    console.log("----------------------------value--------------------------------------"+value);
    return value;
  } catch (error) {
    // Handle errors here
    console.log("error is "+error);
  }
}

componentWillMount() {
    requestData({
      fromDate: '20160601',
      toDate: '20160701',
      assetId: this.getItem(cmn.settings.property),
      url: '/abc/abc/xyz'
    });
  }

【问题讨论】：

标签： reactjs react-native redux

【解决方案1】：

您将财产作为承诺，您需要解决它。尝试使用一些链接。

 assetId: this.getItem(cmn.settings.property).then((res) => res)
          .catch((error) => null);

【讨论】：

【解决方案2】：

由于AsyncStorage 本质上是异步的，您必须等待它返回对象然后调用您的requestData 方法；类似于以下内容 -

class MyComponent extends React.Component {
  componentWillMount() {
    this.retrieveFromStorageAndRequestData();  
  }      

  async getItem(item) {
    let response = await AsyncStorage.getItem(item);
    // don't need await here since JSON.stringify is synchronous
    let responseJson = JSON.stringify(response); 
    return responseJson;
  }

  async retrieveFromStorageAndRequestData = () => {
    let assetId = await getItem(cmn.settings.property);  
    requestData({
      fromDate: '20160601',
      toDate: '20160701',
      assetId,
      url: '/abc/abc/xyz'
    }) ;
  }

  // rest of the component

  render() {
    // render logic
  }
}

【讨论】：