ネイティブフラットリストに反応する - 各子供は「キー」小道具を持っていなければなりません

Question

私は2つのシンプルなフラットリストを持っています。私は各子供がユニークな "キー"小道具を持っている必要がありますが、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

で、この行を変更してみてくださいユニークです。

アプリケーションは状態管理のためにreduxを使用しており、問題のリストは初期状態で初期化されています。モデルはIDのプロパティ名をdivisionIdとshopIdから両方のリストのために平文idに変更しましたが、初期状態オブジェクトでこれを変更するのを忘れてしまいました。したがって、データが到着する前にリストがレンダリングされたとき、キー抽出プログラムはdivisionIdまたはshopIdと代わりにid小道具をアイテムで見つけることができませんでした。データが到着すると、状態はオーバーライドされ、キーは正常に設定されます。答えを

おかげで、私はセットアップが正しいよう、私はそれを考えることができる唯一のことは、そのエラーをスローする可能性があり、この失態が

Answer 2

が、私は問題を発見し、この

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