javascript - 如何正确使用 ReactNative FlatList ScrolltoIndex？

Question

我是 React Native 的新手，我遇到了一个我自己无法解决的问题。

到目前为止，这是我使用它的方式:

export default class Form extends React.Component {
  state = {index: 0};

  _keyExtractor = (item, index) => item.id;

  myscrollToIndex = () => {
    this.setState({index: ++this.state.index});
    this.flatListRef.scrollToIndex({animated: true,index: this.state.index});
  };

  _renderItem = ({item}) => (
    <View>
      <Question {...item} />
      <Button label='Next' onPress={this.myscrollToIndex} style={styles.buttonNext}/>
    </View>
  )

  render() {
    return (
      <View style={styles.container}>
      <FlatList
        horizontal={false}
        ref={(ref) => { this.flatListRef = ref; }}
        scrollEnabled
        data={this.props.form}
        extraData={this.state}
        keyExtractor={this._keyExtractor}
        renderItem={this._renderItem} />
      </View>
    );
  }
}

我想将索引传递给 myscrolltoindex 函数，但我没有成功，因为在我这样做时 this.flatListRef 被排除在外。

有人遇到过类似的问题吗？

谢谢你的时间

Answer 1

使用 index参数也是如此。并传递索引。

例如 _renderItem = ({item, index}) => ( <View> <Question {...item} /> <Button label='Next' onPress={this.myscrollToIndex(index) } style={styles.buttonNext}/> </View> )