HighLight / ScrollTo - React-Native 上的 ListView、ScrollView

Question

我正在玩一些react-native，我卡在了一个我自己想不通的阶段。我有一个项目列表，我想自动滚动到某个项目。

我知道我可以使用 ScrollView 和 contentOffset={{x:0,y:0}} 并设置和偏移，但是它会稍微复杂一点，因为我需要跟踪每个项目，我想知道是否有一种简单的方法来做到这一点，这样我就可以专注于 ListView 中的特定行。

libs 上有这样的东西吗？

Answer 1

ScrollView 不提供滚动到特定列表项的方法 - 但它确实提供了方法 scrollTo({x, y, animated}).

如果您的列表项高度相同，您可以通过调用 scrollTo({y:itemIndex * ROW_HEIGHT}).

使用它们实现滚动到特定项目

为了能够访问 ScrollView 实例，您需要使用 ref 属性 回调进行捕获：

<ScrollView ref={view => this._scrollView = view} />

并在其他地方设置滚动位置：

scrollToRow(itemIndex) {
  this._scrollView.scrollTo({y:itemIndex * ROW_HEIGHT});
}

Answer 2

我已经发布了 react-native-scroll-into-view，一个为 React Native ScrollView 启用 "scrollIntoView" 功能的库。

对于 SectionList 等其他列表，您仍然可以使用其他答案中提到的项目索引。