将 React Native FlatList 滚动到负偏移量

Question

我有一个FlatList，我正在实现一个自定义拉动刷新，其想法是将其滚动到负偏移量，以在释放时显示其下方的动画。这是我的代码FlatList。

const flatListRef = useRef(null);

const handleRelease = () => {
    flatlistRef.current.scrollToOffset({ y: -100 });
    setTimeout(() => {
        flatlistRef.current.scrollToOffset({ y: 0 });
    }, 1000)
}

return (
    <FlatList
        data={data}
        renderItem={({ item }) => {
            return (
                <View style={styles.row}>
                    <Text style={styles.text}>{item}</Text>
                </View>
            )
        }}
        onScroll={onScroll}
        scrollEventThrottle={16}
        onResponderRelease={handleRelease}
        ref={flatListRef}
    />  
)

释放后，FlatList应该滚动到偏移 -100 以显示下面的动画，然后在 1 秒后向上滚动。但发生的情况是它滚动到偏移 0（我可以看出，因为我尝试在释放后立即向下滚动，它会立即尝试向上滚动）。

是否可以以编程方式滚动FlatList到负偏移量？

Answer 1

看来您需要将scrollToOverflowEnabled 设置为true 才能应用此行为。

ScrollView (Flatlist 继承 ScrollView Props )

PS：这是一个不同的想法。如果你想达到-100，也许你可以添加一个固定高度的视图。（看起来一样）一段时间后设置视图关闭。（回到原点？）（如果不行的话......）

- - - - - - - - - 编辑 - - -

<FlatList
        data={data}
        renderItem={({ item }) => {
            return (
                <View style={styles.row}>
                    <Text style={styles.text}>{item}</Text>
                </View>
            )
        }}
        onScroll={onScroll}
        scrollEventThrottle={16}
        onResponderRelease={handleRelease}
        ref={flatListRef}
        scrollToOverflowEnabled={true}  // Just put in here 
    />