React-Native：使用 FlatList ref 的 scrollToIndex 时出错答案

【问题标题】：React-Native: Getting an error when scrollToIndex using FlatList refReact-Native：使用 FlatList ref 的 scrollToIndex 时出错
【发布时间】：2020-11-04 09:11:01
【问题描述】：

我正在尝试滚动到 flatlist 上的特定索引。我正在使用它的水平属性。我正在尝试使用 ref 滚动到特定索引。但我遇到了错误。

scrollToIndex should be used in conjunction with getItemLayout or onScrollToIndexFailed, otherwise there is no way to know the location of offscreen indices or handle failures.

这是我的 Flatlist 代码：

<FlatList
     ref={flatRef}
     showsHorizontalScrollIndicator={false}
     horizontal
     data={data}
     renderItem={renderCell}
   />

这是在特定索引上滚动的代码：

flatRef.current.scrollToIndex({
  animated: false,
  index: index,
  viewPosition: 0.5,
});

【问题讨论】：

标签： reactjs react-native react-native-flatlist scrolltoindex

【解决方案1】：

试试这个添加 onScrollToIndexFailed 函数

<FlatList
  ref={fListRef}
  onScrollToIndexFailed={info => {
    const wait = new Promise(resolve => setTimeout(resolve, 700));
    wait.then(() => {
      fListRef.current?.scrollToIndex({ index: info.index, animated: true/false });
    });
  }}
/>

你也可以签出 git repo :: https://github.com/facebook/react-native/issues/14198

【讨论】：

【解决方案2】：

按照这个：

Flat List - ScrollToIndex should be used in conjunction with getItemLayout or onScrollToIndexFailed

添加 onScrollToIndexFailed 属性，如上述问题中所述

【讨论】：