Question

我有一个FlatList。我在此链接https://github.com/filipemerker/flatlist-performance-tips

中应用了技巧

当用户滚动列表时，我正在更新新项目的数据。但是在更新数据时，列表中有一些缓慢的地方，还有一些错误。我尽可能使用纯组分。我该怎么办。顺便说一句，我想在列表的末尾添加loading（活动指示器）。我该怎么做，您能举个例子或链接吗？

如果您有帮助，我将很高兴谢谢您。

Answer 1

React Native Pure组件实现了带有浅薄同情心的shouldComponentUpdate。通过在shouldComponentUpdate上实现自己的Component方法，可以严格检查要更新数据的道具。

shouldComponentUpdate(nextProps, nextState) {
      return this.props.name !== nextProps.name;
    }

要添加活动指示器，请使用FlatList的ListFooterComponent属性。例如：

footerLoadingIndicator = () => {
return (
  <View style={styles.footerContainer}>
      <Progress.CircleSnail
          size={30}
          thickness={2.5}
          direction={'clockwise'}
          duration={400}
          color={'#22a790'}
        />
  </View>
);

我使用了第三方指标。您可以将其替换为AcitivityIndicator

React Native Flat List Data Change Render

1 个答案: