我是 React Native 的新手,对两者之间的区别感到困惑FlatList
and VirtualizedList
.
So,
- 两者有什么区别
FlatList
and VirtualizedList
?
- 我应该什么时候使用每个?
The <FlatList> 是一个用于渲染基本、平面列表的高性能接口。
另一边,虚拟列表> 是 FlatList> 和 部分列表> 组件,这些组件也有更好的文档记录。一般来说,虚拟列表> 仅当您需要比 FlatList 提供的更多灵活性时才应使用,例如用于不可变数据而不是普通数组。
平面列表示例:
const App = () => {
const renderItem = ({ item }) => (
<Item title={item.title} />
);
return (
<SafeAreaView style={styles.container}>
<FlatList
data={DATA}
renderItem={renderItem}
keyExtractor={item => item.id}
/>
</SafeAreaView>
);
}
虚拟化列表示例:
const App = () => {
return (
<SafeAreaView style={styles.container}>
<VirtualizedList
data={DATA}
initialNumToRender={4}
renderItem={({ item }) => <Item title={item.title} />}
keyExtractor={item => item.key}
getItemCount={getItemCount}
getItem={getItem}
/>
</SafeAreaView>
);
}
更多信息:
https://reactnative.dev/docs/virtualizedlist https://reactnative.dev/docs/virtualizedlist
https://reactnative.dev/docs/flatlist https://reactnative.dev/docs/flatlist
本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)