reactjs - 如何重新渲染平面列表？

Question

与ListView不同，我们可以更新this.state.datasource。有没有更新 FlatList 或重新渲染它的方法或示例？

我的目标是当用户按下按钮时更新文本值...

renderEntries({ item, index }) {
    return(
        <TouchableHighlight onPress={()=> this.setState({value: this.state.data[index].value+1})>
             <Text>{this.state.data[index].value}</Text>
        </TouchableHighlight>
    )
}

<FlatList 
    ref={(ref) => { this.list = ref; }} 
    keyExtractor={(item) => item.entry.entryId} 
    data={this.state.data} 
    renderItem={this.renderEntries.bind(this)} 
    horizontal={false} />

Answer 1

使用 FlatList 组件上的 extraData 属性。

正如文档所述:

By passing extraData={this.state} to FlatList we make sure FlatList will re-render itself when the state.selected changes. Without setting this prop, FlatList would not know it needs to re-render any items because it is also a PureComponent and the prop comparison will not show any changes.