React Native ListView scrollToEnd 它不起作用

Question

我使用 ListView 的scrollToEnd ，但它不起作用，但它適用於scrollTo 。 我該怎么做才能處理它。

Answer 1

有一個解決方法，將其包裝在setTimeout如下所示：

componentDidMount() {
  setTimeout(() => {
    this.refs.dateList.scrollToEnd();
  }, 50);
}

Answer 2

嘗試這個：

<ListView
    ref={ ( ref ) => this.scrollView = ref }
    onContentSizeChange={ () => {        
        this.scrollView.scrollToEnd( { animated: false } )
    } } >
</ListView>

文檔

Answer 3

渲染需要時間，因此在滾動到結束之前 setTimeout() 將起作用。 但是，您可以使用 onLayout() 方法。

export default MyComponent extends React.Component {
  constructor(props) {
    super(props)

    this.scrollToBottom = this.scrollToBottom.bind(this)
  }

  scrollToBottom() {
    this.refs.myView.scrollToEnd()
  }

  render() {
    return {
      <ListView
           onLayout={this.scrollToBottom}
           ref='myView'
           ...
      />
   }
 }

注意：ListView 現在已棄用。

Answer 4

這對我有用。

<Content ref={c => (this.contentComponent = c)}>
....Any code
</Content >

這允許您使用 scrollToPosition(0) 函數，如

this.contentComponent._root.scrollToPosition(0);