Question

我正在使用Flatlist作为无限滚动，就像hotstar / prime video一样，滚动的每个项目都是一个轮播。每个轮播中最多可以包含8-10张图片。

渲染无限滚动的问题很少。

有时，我滚动速度更快时，滚动窗体的空白空间，但有时会被填充。它看起来滚动和渲染速度很多不同。它发生在滚动的两个方向。

滚动时，碰巧在单击时触摸事件没有响应。

此外，当添加新数据以滚动时，渲染速度也很慢。

我已经尝试了官方文档中建议的所有建议的优化，但是问题1和3对于用户来说仍然是错误的体验。

return (
        <FlatList
            style={Style.container}
            data={props.data}
            keyExtractor={getKeyExtractor(props.keyExtractor)}
            renderItem={getRenderItem(props.renderItem)}
            onEndReached={getLoadMore(props.loadMore)}
            onEndReachedThreshold={0.6}
            removeClippedSubviews={true}
            maxToRenderPerBatch={1}
            updateCellsBatchingPeriod={1}
            showsVerticalScrollIndicator={false}
            onRefresh={getRefresh(isRefreshing, setIsRefreshing, props.refresh)}
            initialNumToRender={1}
            refreshing={isRefreshing}
            horizontal={props.horizontal}
            numColumns={1}
            ListHeaderComponent={props.renderHeader}
            stickyHeaderIndices={[0]}
            windowSize={8}
            ref={getRef(props.reference)}
        />
    );

Flatlist中的渲染问题

0 个答案: