如何在 ScrollView 或 ListView 上保持位置？

Question

当您在 ReactNative 应用程序中使用 ScrollView 或 ListView 并且有一些新数据进来时，它们的默认行为是保持在 Scroll 组件中的位置。这意味着当你在ScrollView的中间时，如果高度为20的新数据进来，屏幕上的项目将滑动20，有时它会离开屏幕。

有什么方法可以keep/track这个位置吗？例如，如果有新的高度为 20 的数据进来，位置会自动调整 20 的位置，以便当前屏幕上的项目保持在屏幕上。提前致谢。

Answer 1

我有一个可行的解决方案，虽然不是很顺利，但可以完成工作：

handleScroll = (event) => {
  this.scroll = event.nativeEvent.contentOffset.y
  if (this.ready && this.scroll < SCROLL_TRIGGER) {
    // load more stuff here
  }
}

handleSize = (width, height) => {
  if (this.scroll) {
    const position = this.scroll + height - this.height
    this.refs.sv.scrollTo({x: 0, y: position, animated: false})
  }
  this.height = height
}

// render:

<ScrollView ref="sv"
  scrollEventThrottle={16}
  onScroll={this.handleScroll}
  onContentSizeChange={this.handleSize}
>
  {content}
</ScrollView>

如果有人让某些东西更流畅，请告诉我们！

Answer 2

更优雅的sulotion：

<ScrollView
    ref={(ref => this.scrollViewRef = ref)}
    onScroll={event => { this.yOffset = event.nativeEvent.contentOffset.y }}
    onContentSizeChange={(contentWidth, contentHeight) => { this.scrollViewRef.scrollTo({ x: 0, y: this.yOffset, animated: false }) }}>

如何在 ScrollView 或 ListView 上保持位置？

How can I keep position on ScrollView or ListView?

react-native

react-native-listview

react-native-scrollview