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}`} />); 
}