0

<FlatList>用来渲染一个列表:

  <FlatList

        ListFooterComponent={this.renderFooter}
        ItemSeparatorComponent={this.renderSeparator}
        refreshing={this.state.refreshing}
        onRefresh={this.doPullRefresh}
        onEndReached={this.endFooter}
        initialNumToRender={10}
        onEndReachedThreshold={0.5}
        removeClippedSubviews={false}
        data={this.state.listdata}
        renderItem={({item}) => <ListItem onPress={this.goToStuInfo} alldata={item} id={item.key} number={item.number} avatar={item.avatar} name={item.name} />}
      />

数据的总大小约为 300。所以我可以看到一些数据被显示,而其他数据被呈现为列表项。

此时(一些数据仍在渲染中),如果我触摸一个项目,会有延迟。我必须等待很长时间才能得到回复。即使按下返回按钮,我也必须等待。

是否有任何解决方案可以让列表首先响应我的触摸动作?

我的解决方案

好吧,我通过一次渲染 10 个项目解决了这个问题。

我会将更多数据推this.state.listdata送到onEndReached

为我工作。

4

1 回答 1

0

当你触摸物品时道具会改变吗?300 个列表元素没什么大不了的

“限制渲染窗口还减少了 React 和本机平台需要完成的工作量,例如视图遍历。即使您要渲染一百万个元素中的最后一个,使用这些新列表也无需迭代“通过所有这些元素进行渲染。您甚至可以使用 scrollToIndex 跳转到中间而无需过度渲染。”

于 2017-06-02T13:07:42.037 回答