React Native Flatlist - 每个 child 必须有 "key" prop

Question

我有几个简单的 FlatList，每个都显示部门和商店的自定义列表项。我得到的错误是每个 child 应该有一个唯一的 "key" 道具，但我已经定义了一个 keyExtractor 并尝试将 key 道具添加到自定义列表行组件。即

<FlatList
  style={_styles.list}
  data={this.props.divisions}
  extraData={this.state.chosenDivisionId}
  keyExtractor={this._keyExtractor}
  renderItem={this._renderDivisionItem}/>}
/>

_keyExtractor = (item, index) => item.id

_renderDivisionItem = ({ item, index }) => {
    let typedItem: DivisionData = item;
    return (
      <ShopListItem
        text={typedItem.name}
        selected={this.state.chosenDivisionId === typedItem.id}
        itemId={typedItem.id}
        key={typedItem.id} /* Have tried with and without this */
        onPress={itemId => this._updateStateForDivisionChosen(itemId)}
      />
    );
  };

怎么还是提示，我是不是做错了什么？ keyExtractor 方法在我的其他 FlatLists 上运行良好。当然，使用的 ID 是唯一的

Answer 1

尝试用这个

改变这一行

_keyExtractor = (item, index) => typedItem.id

Answer 2

我发现了问题。

该应用正在使用 redux 进行状态管理，并且使用初始状态对相关列表进行了初始化。模型已将 id 的属性名称从 divisionId 和 shopId 更改为两个列表的普通 id - 但我忘记在初始状态对象中更改它.因此，当列表在数据到达之前呈现时，密钥提取器无法在项目上找到 id 道具，因为它们被称为 divisionId 或 shopId。当数据到达时，状态将被覆盖，键将正常填充。

感谢您的回答，我希望这个错误能对以后的人有所帮助:-)

React Native Flatlist - 每个 child 必须有 "key" prop

React Native Flatlist - Each child must have "key" prop

reactjs

react-native

react-native-flatlist