使用 keyExtractor，仍然收到警告我的物品没有钥匙

Question

我正在创建一个 flatList，但仍然收到我的物品上没有钥匙的警告。

我已经尝试创建一个函数来解构 props。

我的渲染方法：

render() {
    return (
      <View>
        <FlatList
          data={this.props.matches}
          renderItem={({ item }) => (
            <ListItem
              title={`${item.deck} vs. ${item.opponentDeck}`}
              subtitle={item.record}
              keyExtractor={(item)=>item.time}
            />
          )}
        />
      </View>
    );
  }

this.props 看起来像：

Matches:  Array [
  Object {
    "OTPGameOne": false,
    "OTPGameTwo": false,
    "deck": "Amulet",
    "gameLosses": 0,
    "gameWins": 2,
    "opponentDeck": "Esper",
    "time": "04/26 3:08 p.m.",
    "winGameOne": true,
    "winGameTwo": true,
    "winMatch": true,
  }
  ...
],
Headings:  Array [
  "Deck",
  "Opp Deck",
  "Win Match",
  "Time/Date",
]

Answer 1

keyExtractor 应该在 flatlist 而不是 renderItem

<FlatList
  data={this.props.matches}
  keyExtractor={(item)=>item.time}
  renderItem={({ item }) => (
    <ListItem
      title={`${item.deck} vs. ${item.opponentDeck}`}
      subtitle={item.record}/>
  )}
/>

使用 keyExtractor，仍然收到警告我的物品没有钥匙

Using keyExtractor, still getting warning that my items don't have keys

reactjs

react-native

react-native-flatlist