0

我正在尝试使用<FlatList>'ssnapToOffsets和复制这种效果stickyHeaderIndices,其中卡片相互滑动并粘在顶部。

https://i.imgur.com/EY37RKS.gifv

这是我的代码:

<FlatList
        horizontal={false}
        data={posts}
        initialNumToRender={5}
        pagingEnabled={false}
        decelerationRate={0}
        // the first PostCard starts 44 from the top and then each one is 164 tall
        snapToOffsets={[...Array(posts.length)].map(
          (_, i) => 44 + i * 164
        )}
        // I want every single item in the FlatList to be sticky, but this isn't working
        stickyHeaderIndices={[...Array(posts.length)]}
        contentContainerStyle={{ width }}
        keyExtractor={(item) => item.id}
        renderItems={({ item, index }) => (
          <PostCard {...item} style={{ zIndex: index }}/>
        )}
/>

实际上没有任何东西最终会粘在顶部。snapToOffsets为我工作,但stickyHeaderIndices根本不工作。

如果我尝试将硬编码的数组传递给stickyHeaderIndiceslike [0,1,2,3...20],那么中间某处的一个随机帖子最终会粘住,而其他任何东西都不会。

我检查了 SO 和 Github 上的每个搜索结果,但没有任何效果,我已经尝试了好几天。请帮忙!

4

0 回答 0