异步功能无法执行

Question

retrieveData = async () => {
    try {
        //Retrieving values from AsyncStorage
        let voiture = await AsyncStorage.getItem('VOITURE')
        this.state.DBCarName=[];
        this.state.DBCarName = JSON.parse(voiture);
        alert(this.state.DBCarName)
    }
    catch {
        alert('error')
    }
}

该函数的调用：

render() {
                this.retrieveData();

我想使用我的检索函数，以便为DBCarName状态分配一个值，以便在Text组件中呈现它。问题是，在render方法中调用函数时，它返回null，这可能意味着我的函数未执行且数组状态为空。

关于如何处理这个想法？

Answer 1

发生这种情况是因为您试图重新分配组件的状态，而应该使用提供的this.setState函数。由于您使用的是AsyncStorage和this.state，因此我假设它是一个React Native项目，这里的代码应如下所示：

class YourComponentName extends React.Component {
  state = {
    DBCarName: []
  }

  retrieveData = async () => {
    try {
      //Retrieving values from AsyncStorage
      const voiture = await AsyncStorage.getItem('VOITURE')
      this.setState({ DBCarName: JSON.parse(voiture) })
    } catch (err) {
        console.log(err)
    }
  }

  render () {...}
}