10

对于我正在处理的项目，我需要创建一个组件，用户可以在其中将条目添加到处于状态的数组中，并SectionList显示这些条目。此外，我需要 SectionList 在输入后立即向下滚动到最新条目。请查看此小吃的示例

添加新条目后，列表本身会显示所有条目和更新，但是一旦列表包含的内容超出屏幕可以显示的范围，它只能向下滚动到倒数第二个，我真的需要滚动到最后一个。

我尝试了很多东西，包括等待 setState，定义 contentContainerStyle，将整个东西转换为VirtualizedListand ScrollView，我能想到的一切，但我根本无法让它滚动到最后一个条目。

问题：如何让我的 SectionList 滚动到当前超出 SectionList 组件范围的最后一项？

更新 我知道这个问题是由SectionList调用 scrollToLocation 时不包含该项目引起的。解决方案的关键似乎是等待列表的重新渲染

更新 2 SetState 有一个回调也不能解决这个问题。但是，此评论中的解决方案有效。它的问题是它只适用于 .js 文件，而我正在整个项目中使用 .tsx 文件。我怎么能克服这个？

4

2 回答 2

1

显然这是 React-Native 0.59.6 中的一个错误。

在android上，在完成块中工作时setState，需要设置0.2秒的超时时间，之后，SectionList会一直向下滚动。但是，应该存在的项目尚未渲染，有时会在 0.5 秒后出现，从而导致非常笨拙的感觉。

我在这里发布了一个问题，希望它会尽快修复

于 2019-06-09T21:00:05.853 回答
0

我认为这个问题比这简单得多，并且与您的风格有关。

您要求列表具有height: Dimensions.get('window').height - 50，但这条线什么也不做，因为您无法修复 SectionList 的高度。

所以你可以删除它并添加一个边距：

list: {
  top: 50,
  marginBottom: 50,
},
于 2019-06-09T16:37:51.350 回答