无法通过 AsyncStorage 数据进行映射

Question

我尝试使用 AsyncStorage 和 multiGet 属性构建反应本机应用程序。我可以成功地将内容添加到存储中，甚至可以在调试器 console.log 中显示它，但是当我想映射数据数组时，它总是没有显示任何结果。有谁知道问题出在哪里？

 componentDidMount() {
    this._getAllData();
  }

  _getAllData = async () => {
    try {
      const data = [];
      const keys = await AsyncStorage.getAllKeys();
      const items = await AsyncStorage.multiGet(keys, (err, stores) => {
        stores.map((result, i, store) => {
          // let key = store[i][0];
          let value = store[i][1];
          let parsedValue = JSON.parse(value);
          data.push(parsedValue);
        });

        this.setState({ data });
      });
    } catch (error) {
      this.setState({ error });
    }
  };


 _displayAllData = () => {
    // console.log(this.state.data.length);
    // console.log(this.state.data);

    this.state.data.length &&
    this.state.data.map(el => {

      return (
        <View>
          <Text>{el.name}</Text>
          <Text>{el.street}</Text>
          <Text>{el.postalCode}</Text>
          <Text>{el.city}</Text>
          <Text>{el.phone}</Text>
          <Text>{el.email}</Text>
          <Text>{el.nip}</Text>
        </View>
      );
    });
  };

然后在呈现我的内容时我尝试

        {this._displayAllData()}

Answer 1

目前您的 _displayAllData 方法没有 returning 任何东西。您需要 return 地图结果，以便通过您的方法 return 编辑一些 JSX。

 _displayAllData = () => {


    // console.log(this.state.data.length);
    // console.log(this.state.data);

    return this.state.data.length &&
    this.state.data.map(el => {

      return (
        <View>
          <Text>{el.name}</Text>
          <Text>{el.street}</Text>
          <Text>{el.postalCode}</Text>
          <Text>{el.city}</Text>
          <Text>{el.phone}</Text>
          <Text>{el.email}</Text>
          <Text>{el.nip}</Text>
        </View>
      );
    });
  };

无法通过 AsyncStorage 数据进行映射

Cannot map through AsyncStorage data

reactjs

react-native

asyncstorage