React Native Flatlist-VirtualizedList:您有一个很大的列表,更新缓慢

Emi*_*yan 6 react-native react-native-flatlist

我有一个包含大量内容的平面列表,当我在调试器控制台上滚动10到15页后向下滚动时,我得到了以下信息:

VirtualizedList:您有一个更新缓慢的大列表-确保您的renderItem函数呈现遵循React性能最佳实践的组件,例如PureComponent,shouldComponentUpdate等。{dt:582,prevDt:1651,contentLength:15187.5}

仅供参考:我尝试过使用PureComponent和更多方式,但没有人帮忙,我在控制台中得到了相同的输出。

为什么我得到这个,如何解决呢?

这是我的代码:

<FlatList
    data={outfits}
    keyExtractor={(item, index) => index}
    numColumns={2}
    initialNumToRender={5}
    getItemLayout={(outfits, index) => (
       { length: 50, offset: 50 * index, index }
    )}
    extraData={this.state.extraData}
    renderItem={({item,index}) => <Items item={item} index={index}/>}
    onRefresh={this.handleRefresh}
    refreshing={this.state.refreshing}
    onEndReached={this.handleLoadMore}
    onEndReachedThreshold={20}
    ListFooterComponent={this.renderFooter}
/>
Run Code Online (Sandbox Code Playgroud)

小智 2

Content我在https://docs.nativebase.io中遇到了同样的问题,我更改ContentView并使用了PureComponent. 现在开始工作了!