Rumah > hujung hadapan web > tutorial js > react-native flatlist上拉加载onEndReached频繁触发怎么解决

react-native flatlist上拉加载onEndReached频繁触发怎么解决

php中世界最好的语言
Lepaskan: 2018-03-19 16:26:06
asal
8868 orang telah melayarinya

这次给大家带来react-native flatlist上拉加载onEndReached频繁触发怎么解决,解决react-native flatlist上拉加载onEndReached频繁触的注意事项有哪些,下面就是实战案例,一起来看一下。

问题

在写flatlist复用组件时,调用的时候如果父组件是不定高的组件,会造成组件无法显示

如果父组件样式{flex:1},则会出现下拉方法频繁触发或不正常触发的问题(我这里出现的问题是在列表第6个项目在底部时,缓慢上拉会多次触发flatlist的onEndReached监听)

原因

推测是因为{flex:1}不适合做动态高度组件的父组件样式,会错误的判断高度导致onEndReached多次不正常触发。

解决

可以把列表上方所需的组件做成header属性传入组件当做flatlist的头部组件,这样就可以直接调用封装好的组件。

也可以把父元素的样式设成{height: '100%'},这样就可以正确的触发onEndReached监听。

相信看了本文案例你已经掌握了方法,更多精彩请关注php中文网其它相关文章!

推荐阅读:

JavaScript之优化DOM

Vue的计算属性

Atas ialah kandungan terperinci react-native flatlist上拉加载onEndReached频繁触发怎么解决. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!

Label berkaitan:
sumber:php.cn
Kenyataan Laman Web ini
Kandungan artikel ini disumbangkan secara sukarela oleh netizen, dan hak cipta adalah milik pengarang asal. Laman web ini tidak memikul tanggungjawab undang-undang yang sepadan. Jika anda menemui sebarang kandungan yang disyaki plagiarisme atau pelanggaran, sila hubungi admin@php.cn
Tutorial Popular
Lagi>
Muat turun terkini
Lagi>
kesan web
Kod sumber laman web
Bahan laman web
Templat hujung hadapan