Question

我只是想做一个场地清单。

这是console.log(this.state.venues)的结果：

Array [
    Object {
        "key": "5b0ac89e***",
        "venuename": "Venue1",
    },
    Object {
        "key": "557d70asd****",
        "venuename": "Venue2",
    },
    Object {
        "key": "58f316ccsa****",
        "venuename": "Venue3",
    },
]

我是通过像这样从fq-api中提取数据来创建此数据的：

for (var i=0; i < 5; i++) {
    this.state.venues.push({
        venuename: response.data.response.groups[0].items[i].venue.name,
        key: response.data.response.groups[0].items[i].venue.id
    });
}

这是我的JSX：

<View style={styles.list}>
    <FlatList data={[this.state.venues]}
              renderItem={({item}) => <Text style={styles.item}>{item.venuename}</Text>}
              keyExtractor={(item, index) => item.key} />
</View>

我收到列表中的每个孩子都应该有一个唯一的“关键”道具错误。一切对我来说似乎还可以，我不明白为什么它会失败。我不知道这是什么“关键道具”，我从获取中获得并尝试使用它，但是我无法继续。

感谢您的帮助。

Answer 1

您的错误在于您的data属性。

您要在数据属性上放置一个二维数组，因此keyExtractor将尝试提取：[].key (undefined)而不是item.key ...

由于二维数组，我认为您也只渲染列表中的一项，对吗？

反应本机列表列表中的每个子代均应具有唯一的“键”道具

1 个答案: