ReactNative FlatList一次渲染所有项目？

Question

我正在使用ReactNative的新List组件 - FlatList.

即使单元格在屏幕上实际不可见,FlatList似乎也会立即呈现所有项目.

<FlatList data={this.props.items} 
          keyExtractor={(item, index) => generateKey()}
         renderItem={this.renderStrip}/>

 renderItem = ({item}) => { 
   console.warn('rendered!');
   return <View style={{height:200, height: 100}} />
}

根据项目的总数调用设置30个项目并且似乎"呈现"警告.

我认为FlatList类似于Android中RecycleView的工作方式,只有当它在屏幕上可见时才会呈现项目.

我错过了什么吗？它不会降低性能吗？
我希望它只能在它即将展示时呈现一个项目.

Answer 1

我的一个应用中出现了相同的问题。为我解决这个问题花了几个小时。

???

TDLR; 看看，您没有将FlatList嵌套在ScrollList（或其他类型的列表）中。

???

详细说明：

问题

与Thread-Opener相同，起初，我的Flatlist仅渲染我在中定义的渲染量initialNumToRender，但此后，应用程序立即开始渲染List的其余部分。

环保环境

我将native-base.io用作UI-Library，并使用Component封装了屏幕内容

解

我已经知道，该基于本地的组件<Content>替换了ScrollList。ScrollList内的FlatList会将您引导到奇怪的结果。当我用替换给定Screen的-Component时<View>，所有事情都按预期工作。