ListView 和 FlatList 有什么区别? [英] What's the difference between ListView and FlatList?

问题描述

根据 Facebook 的文档，

According to Facebook's documentation,

ListView - 一个核心组件，设计用于高效显示垂直滚动的变化数据列表.

ListView - A core component designed for efficient display of vertically scrolling lists of changing data.

FlatList - 用于呈现简单、平面列表的高性能界面.

FlatList - A performant interface for rendering simple, flat lists.

似乎两者都有效.两者取舍时应考虑什么?

It seems both are efficient. What should we consider when choosing one from the other?

推荐答案

FlatList - 与 ListView 相比性能更高.一旦项目数量变大，ListView 渲染就会变慢.FlatList 显着提高了内存使用率和效率(特别是对于大型或复杂的列表)，同时还显着简化了 props — 不再需要 dataSource！

FlatList - More performant compared to ListView. ListView rendering can get slow once the number of items grows larger. FlatList significantly improves memory usage and efficiency (especially for large or complex lists) while also significantly simplifying the props — no more dataSource necessary!

功能
Flatlist 包含充满功能的新组件，可以处理大多数开箱即用的用例:

Features
Flatlist is packed with new components full of features to handle the majority of use cases out of the box:

• 滚动加载(onEndReached).
• 拉动刷新(onRefresh/refresh).
• 可配置的可见度 (VPV) 回调(onViewableItemsChanged/viewabilityConfig).
• 水平模式(水平).
• 智能项目和部分分隔符.
• 多列支持(numColumns)
• scrollToEnd、scrollToIndex 和 scrollToItem
• 更好的 Flow 输入.

FlatList 仍然缺少一些功能，例如粘性标题，但它正在快速发展.ListView 将被 弃用.

ListView 现在已弃用，并且扁平列表中的粘性标题现在可以使用

ListView is deprecated now and Sticky Headers in Flat list working now

更好的选择

在平面列表中渲染 5000 多个项目时出现性能问题.寻找其他替代方案并找到 recyclerlistview - React Native 和 Web 的高性能列表视图.与平面列表相比，scrollTo 性能和渲染优化要好得多.

I was getting performance issues while rendering 5000+ items in flat-list. Looked for other alternatives and found recyclerlistview - High performance list-view for React Native and web. Much better scrollTo performance and better rendering optimisations compared to flat-list.

这篇关于ListView 和 FlatList 有什么区别?的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！