React Native flatlist -virtualizedList:您有一个较大的列表，该列表的更新速度很慢

Question

我有一个平坦的列表，其中包含大量内容，当我在调试器控制台上10-15页后向下滚动时，我得到了：

virtualizedList：您有一个较大的更新列表 - 确保您的RenderItem函数呈现遵循React的组件 绩效最佳实践，例如Purecomponent，shorecomponentupdate， 等等{dt：582，prevt：1651，contentlength：15187.5}

fyi：我试图使用属质组件和更多方法，但是没有人会有所帮助，我在控制台中获得相同的输出。

为什么我得到这个，该如何解决？

这是我的代码：

<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}
/>

Answer 1

i在https://docs.nativebase.io中与Content相同的问题，我将Content更改为View，并使用了PureComponent。现在正在工作！

Answer 2

请使用RefreshControl和Props Refresh Contrans in Contess Native Base

 import { StyleSheet, RefreshControl } from 'react-native';
...
render(
  <Content refreshControl={<RefreshControl refreshing={this.state.refreshing} onRefresh={this._onRefresh.bind(this)} />}>
       <List .../>
      </Content>
...
)