onEndReached 在渲染时被多次调用

Question

在下面的小测试应用程序中，onEndReached 被多次调用，我没有滚动。

export default function App() {
  const [state, setState] = useState([ //just a series of "random" to fill up the screen ]);
  let i = 0;
  return (
    <View
      style={{
        flex: 1,
        justifyContent: "center",
        alignItems: "center",
      }}
    >
      
      <FlatList
    inverted
    onEndReached={() => {
      let stateCopy = [...state];
      stateCopy.push("extra");
      setState(stateCopy);
    }
    }
    data={state}
    keyExtractor={item => i=i+1}
    renderItem={({ item }) => {
    return (
        <Text>{item}</Text>
    );
    }}
/>
    </View>
  );
}

我尝试按照 中描述的方法进行操作，但那里的解决方案不起作用。我该如何解决这个问题？

Answer 1

添加 onEndReachedThreshold={0.001} 或任何其他十进制数可解决问题。