React-native ListView鍵

Question

我在我的應用程序中收到一條警告，令我困擾。反應總是說我需要爲每一行添加鍵，但不管我不能添加這些鍵。

我的代碼看起來是這樣的：

<ListView 
    style={styles.listView} 
    dataSource={this.state.favs} 
    renderSeparator={() => <View style={styles.listSeparator}/>} 
    renderRow={(rowData,i) => <Card data={rowData} 
      onPress={this.onCardPress.bind(this,rowData)} /> } 
/> 

我嘗試添加的關鍵我的組件在這樣<Card key={rowData.id}/>/ ，我還嘗試了從道具的關鍵我的組件裏面，並在第一添加它元件在我的情況下是TouchbleOpacity

<TouchableWithoutFeedback 
     key={this.props.key} 
     style={styles.cardBtn}> 

有人可以給我提示一個提示嗎？或者我應該忽略這個警告？

Answer 1

其實renderRow得到四個參數(rowData, sectionID, rowID, highlightRow)，你需要第三個而不是第二個。

renderRow={(rowData, sectionID, rowID) => <Card key={rowID} data={rowData} 
      onPress={this.onCardPress.bind(this,rowData)} /> } 

參考：facebook.github.io/react-native/docs/listview.html#renderrow

Answer 2

正如他在comment指出加布裏埃爾·洛佩斯，一個常見的錯誤是忘記密鑰添加到分隔符。

所以確保他們被添加。您可以從傳遞到分離器函數的參數進行編譯：

renderSeparator(sectionId, rowId, adjacentRowHighlighted) { 
    return (<View key={`sep:${sectionId}:${rowId}`} />); 
}