将FlatList与scrollToEnd一起使用

Question

使用FlatList时，我有两个问题（它们都可以与ListView一起使用）。

我有一个列表，该列表通过每个项目的显示属性显示，然后像这样在我的FlatList中签入：

<FlatList
  ref='flatList'
  data={this.state.dataSource}
  enableEmptySections
  renderItem={({item}) => item.display && <Text>{item.text}</Text>} />

当我更改显示属性时，它不会显示。在ListView设置中，此方法运行良好。

我的第二个问题是，scrollToEnd在scrollToEnd函数内的“ this._listref”上引发了未定义的错误。我没有给它传递任何参数。

setTimeout(this.refs.flatList.scrollToEnd, 0)

我的问题是，如何更新列表数组中的数据，以便列表中的数据更改，第二个问题是如何解决scrollToEnd错误？

更新1 ：（已删除数据，不再需要）

更新2：问题一已解决，该列表需要进行“ extraData”比较以查看其是否更新。固定版：

<FlatList
  ref='flatList'
  data={this.state.dataSource}
  extraData={this.state}
  enableEmptySections
  renderItem={({item}) => item.display && <Text>{item.text}</Text>} />

这有点令人费解，但是我相信extraData可以用作比较，以查看该数据集中是否有任何更新。如果是这样，请重新渲染。这个问题解决了。

“未定义不是对象（正在评估'this._listRef'）”仍然不固定

更新3：如果在setTimeoutFunction之外使用，则滚动功能有效

更新4：

设置初始数据数组

  this.state = {
    dataSource: pageService(state.params.page),
    cursor: 0
  }

将显示设置为true：

  renderNextModule() {
    let newCursor = this.state.cursor
    if (newCursor < this.state.dataSource.length-1) {

        newCursor++
        let newSource = this.state.dataSource
        newSource[newCursor].display = true
        this.setState({
            dataSource: newSource,
            cursor: newCursor
        })
    }
  }

Answer 1

它对我的工作

data={this.state.messages}
ref = "flatList"
onContentSizeChange={()=> this.refs.flatList.scrollToEnd()}