React Native：如何使用不同的键从 JSON 获取数据并显示它？

Question

我是 react-native 和 JavaScript 的新手。 我有如下所示的 JSON：

{"AB1281":{"id":"AB1281","score":90,"status":"SUCCESS"},
"CA9412":{"id":"CA9412","score":40,"status":"FAILED"},
"GG1921":{"id":"GG1921","score":80,"status":"SUCCESS"}}

假设我从这段代码中得到这个 JSON：

  componentDidMount() {
    return fetch(url)
    .then((response) => response.json())
    .then((responseJson) => {
      this.setState({
        isLoading: false,
        dataSource: responseJson,
      })
    })
    .catch((error) => {
      console.log(error)
    });
  };

如您所见，所有键都各不相同（“AB1281”、“CA9412”、“GG1921”）。 如何解析这些数据并在列表视图中呈现它？

Answer 1

如果你想使用 FlatList 你必须有一个数组。 这里有一个具有三个属性的对象。 或者你可以使用 ScrollView 来循环你的对象属性：

<ScrollView>
  {Object.keys(dataSource).map((key, index) => (
    <Text>{data[key].id}</Text>
  ))}
</ScrollView>

正如本机文档所说，如果您的列表很长，最好使用 FlatList。 看到这个。