我有一个获取初始DataSource的ListView。然后,用户可以运行搜索,该搜索将使用新的DataSource更新ListView。不幸的是,发生这种情况时,滚动位置会重置,这不是理想的选择。
我尝试重用同一ListView.DataSource对象,而不是创建一个新对象,但这给了我相同的结果:
...
dataSource: new ListView.DataSource({
rowHasChanged: (r1, r2) => r1 !== r2
}),
componentWillReceiveProps(nextProps) {
this.setState({
dataSource: this.dataSource.cloneWithRowsAndSections({...});
}
...
更改数据源后,我尝试在ListView上使用scrollTo,但是这种情况下该应用程序跳跃了很多……不是很好的体验。是否有ListView设置或更新dataSource的其他方法来阻止滚动位置的重置?
ListView有2个粘性 header ,顶部 header 有2行页面描述和一个redux容器,可渲染3个图像网格。第二部分列出了多达50个要渲染的组件:正方形图像,一些文本和一些SVG。我当前的方法使用onContentSizeChange强制滚动位置,但是这会导致滚动位置跳动,并且看起来是业余的。
更新:深入到ListView的文档和源代码中,它最终仅呈现了ScrollView。我可以使用 contentOffset 来设置初始滚动位置,但是当ListView DataSource更新时,它似乎无济于事。甚至硬编码contentOffset也无济于事。我还尝试将 scrollEnabled 设置为false,这确实阻止了用户驱动的滚动,但是在更新DataSource时,ListView滚动位置仍然被重置:
更新2:我进行了一些进一步的调试,发现建议的rowHasChange和sectionHeaderHasChanged函数仅呈现需要渲染的行/节头就可以很好地完成工作。
最佳答案
您可以保存滚动位置,并在将新 Prop 设置为ListView之后—使scrollTo不含动画
关于react-native - 有没有一种方法可以在本地更新 native ListView数据源,从而不会重置滚动位置?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/40368269/