9

我有一个获取初始数据源的 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 设置或不同的方式来更新数据源，以防止滚动位置重置？

ListView 有 2 个粘性标题，顶部标题有 2 行页面描述和一个渲染 3 个图像网格的 redux 容器。第二部分列出了多达 50 个渲染起来有些繁重的组件：一个方形图像、一些文本和一些 SVG。我当前的方法使用 onContentSizeChange 来强制滚动位置，但这会导致滚动位置跳跃并且看起来很业余。

更新：深入研究 ListView 的文档和源代码，它最终只会呈现一个 ScrollView。我可以使用contentOffset来设置初始滚动位置，但是当 ListView DataSource 更新时它似乎没有帮助；即使硬编码 contentOffset 也无济于事。我还尝试将scrollEnabled设置为 false，这确实阻止了用户驱动的滚动，但是 ListView 滚动位置在其 DataSource 更新时仍会重置：s

更新 2：我做了一些进一步的调试，发现建议的 rowHasChange 和 sectionHeaderHasChanged 函数在只渲染需要渲染的行/节标题方面做得很好。

4

2 回答 2

0

您可以保存滚动位置并在将新道具设置为 ListView 后 — 使 scrollTo 没有动画

于 2016-11-18T21:49:00.527 回答
0

在您的情况下，我会做的是显示一种带有加载微调器的叠加层以隐藏弹跳效果，然后在设置滚动后隐藏叠加层，因为我很陌生，所以不知道如何实现它RN，但肯定有可能

于 2017-03-20T19:28:55.050 回答