我们可以像这样为ListView创建数据源
var ds = new ListView.DataSource({rowHasChanged: (r1, r2) => r1 !== r2});
var dataSource = ds.cloneWithRows(['row 1', 'row 2']), };
Run Code Online (Sandbox Code Playgroud)
但是,如果我想添加项目或从数据源中删除项目,我该怎么做?我是否需要始终使用更新的数组调用cloneWithRows?
当我使用新的部分和行更新状态时,我有一个React Native ListView似乎正在删除UI中的错误行 - 我删除的行保留,但是下面的那个,有时甚至是2,直到我重新加载应用程序.
我究竟做错了什么?
constructor(props) {
super(props)
this.state = {
dataState: DataState.STATE_NOT_LOADED,
dataSource: new ListView.DataSource({
rowHasChanged: (r1, r2) => r1.identifier !== r2.identifier,
sectionHeaderHasChanged: (s1, s2) => s1 !== s2
})
};
}
componentDidMount() {
this.loadData();
}
loadData() {
this.setState({
dataState: DataState.STATE_LOADING
});
User.getDocs()
.bind(this)
.then(results => {
var docs = _.groupBy(results, function (d) {
return d.createdAt.format('MMMM D');
});
this.setState({
dataState: DataState.STATE_LOADED,
dataSource: this.state.dataSource.cloneWithRowsAndSections(docs)
});
})
.catch(error => {
console.log(error);
this.setState({
dataState: DataState.STATE_ERROR
});
});
}
onTrackPressed(doc) {
User.untrackDoc(doc) …Run Code Online (Sandbox Code Playgroud) 我0.12.0在Android上使用React Native()并在我的页面上有一个ListView组件.我希望能够从列表中删除项目.
这个ListView看起来像这样:
<ListView
dataSource={this.state.dataSource}
renderRow={this._renderStory}
onEndReached={this._getStories}
/>
Run Code Online (Sandbox Code Playgroud)
该rowHasChanged方法看起来像这样.
this.state = {
dataSource: new ListView.DataSource({
rowHasChanged: (row1, row2) => {
return row1 !== row2;
},
}),
loaded: false,
};
Run Code Online (Sandbox Code Playgroud)
所有这一切都很好.
现在,要删除一个项目,我有这个代码:
var indexOfItem = this._data.findIndex((item) => item.id === story.id);
this._data.splice(indexOfItem, 1);
this.setState({
dataSource: this.state.dataSource.cloneWithRows(this._data),
});
Run Code Online (Sandbox Code Playgroud)
我可以确认该项目正在从中删除this._data.this.state.dataSource._cachedRowCount应该减少一个.正在更新状态并触发渲染周期.但该项目不会从页面中删除.更重要的是,如果我放入控制台登录this._renderStory(),唯一发生的事情就是在列表底部呈现一个新行.
我错过了什么吗?我还需要做另一个步骤吗?
这里也提出了类似的问题,但他从来没有得到关于删除一行的答案.如何在ListView中添加/删除项目?
我在这个地方看到的所有其他例子都没有删除项目的例子.
更新:谢谢,它需要传递数组的克隆并设置一个键(抱歉只能接受一个答案).但这意味着整个清单正在呈现.最后,我只是在项目上设置了一个'removed'属性,测试了该属性的变化,如果一个项目被标记为remove,则在render方法中返回null,这比重新渲染所有项目更快.