Tips——Flatlist的onEndReached多次触发问题解决
一、问题
RN项目里使用Flatlist组件,上拉刷新item过多时,出现跳屏、闪屏、空白屏等问题。
二、原因
先在render函数里log了一下,发现没有re-render,判断不是网络请求或页面内组件数据变动导致的重复渲染;
然后判断是Flatlist自己的触底监听机制有问题;
最后查到是因为最外层父View没有设置固定height或只设置{flex:1}属性,导致onEndReached不能正确监听事件。
三、解决
1.给最外层父组件一个固定高度{height:‘100%’};
2.设置onEndReachedThreshold={0.01},确保滑动到距离底部最后0.01时再调动加载功能即可。
Tips——Flatlist的onEndReached多次触发问题解决的更多相关文章
- react-native flatlist 上拉加载onEndReached方法频繁触发的问题
问题 在写flatlist复用组件时,调用的时候如果父组件是不定高的组件,会造成组件无法显示 如果父组件样式{flex:1},则会出现下拉方法频繁触发或不正常触发的问题(我这里出现的问题是在列表第6个 ...
- 关于React Native中FlatList的onEndReached属性频繁调用的一种解决办法
FlatList组件是RN0.43后引入的组件.作为高性能列表组件,FlatList在ListView的基础上优化了加载性能并简化了渲染过程.不仅如此,该组件还提供了onRefresh和onEndRe ...
- angular分页插件tm.pagination二次触发问题解决歪方案
今天在学习angularjs的分页插件时遇到了一个前端的问题,谷歌浏览器开发者模式调试的时候发现每次点击分页刷新按钮会触发两次后台请求,ajax向后台发送了两次请求,这对于强迫症患者来说是一个比较恶心 ...
- DropDownlist数据SelectedIndexChanged触发问题解决
1.设置DropDownlist的AutoPostBack为True 2.绑定DropDownlist数据时出现了重复项, 在载入数据时保存数据状态应该写在Load事件中的if (!IsPostBac ...
- [RN] React Native 实现 FlatList上拉加载
FlatList可以利用官方组件 RefreshControl实现下拉刷新功能,但官方没有提供相应的上拉加载的组件,因此在RN中实现上拉加载比下拉刷新要复杂一点. 不过我们仍可以通过FlatList ...
- 对Verilog 初学者比较有用的整理(转自它处)
*作者: Ian11122840 时间: 2010-9-27 09:04 ...
- React Native踩坑之FlatList组件中的onEndReached
最近在做一个RN项目,有使用到FlatList这样一个RN封装的组件去做上拉加载更多功能,在iOS和Android平台上,总结了以下几个遇到的问题及解决方案 1. 进入页面onReached开始就被触 ...
- iphone上click事件不触发的问题解决。
iphone上click事件不触发的问题解决. //在ID为jsProvince上有这么一个事件: $('body').on('click', '#jsProvince', function(e){ ...
- 键盘事件触发的兼容tips
在firefox中 退格键 enter del tab 这些非字符触发编码为0 然而在Safari3以下 是8
随机推荐
- robot framework —— 变量文件
何为变量文件? 变量文件中包含了测试数据中的变量.虽然变量可以通过变量表格中创建, 或者通过命令行设置, 不过这些方法有所局限, 而变量文件可以动态地创建任意类型的变量. 变量文件一般由Python模 ...
- [JavaScript] 根据字符串宽度截取字符串
/** * 根据字符串宽度截取字符串 * @param desc 原始字符串 * @param width 该显示的宽度 * @param fontsize 字体大小 12px * @returns ...
- [Swift实际操作]七、常见概念-(9)使用定时组件Timer执行定时任务
本文将为你演示计时器的使用,使用计时器可以每隔一定时间执行某个函数. 在左侧的项目导航区,打开视图控制器的代码文件:ViewController.swift现在开始编写代码,实现任务定时的功能.定义一 ...
- 【wireshark】总体结构
1. 总体结构 wireshark的总体结构如下图所示. 2. 功能模块 模块名 功能 源码子目录 GTK/Qt 处理所有的用户输入/输出(所有的窗口,对话框等等) /ui GTK: /ui/gtk ...
- call、apply、bind的异同
一.call.apply.bind的异同 JavaScript中函数可以通过3种方法改变自己的this指向,它们是call.apply.bind.它们3个非常相似,但是也有区别.下面表格可以很直观看出 ...
- OC 中的属性
自动合成 (autosynthesis) @property 语法,会做下面两件事情 自动生成存取方法 由编译器生成,编辑器里不会看到这些方法. 向类中添加适当类型的实例变量 在属性前加下划线,作为实 ...
- Linux必备命令
目录 概述 常用系统工作命令 系统状态检测命令 工作目录切换命令 文本文件 ...
- 【BZOJ1069】【SCOI2007】最大土地面积
题目大意:给定有n个点的点集,求该点集中任意四个点所构成的四边形中面积最大四边形的面积. 我们不难想到(不难yy出来),面积最大的四边形的四个顶点一定所给定的点集所构成的凸包上.我们求出给定点集的集合 ...
- vue微信分享链接添加动态参数
微信分享时 分享链接携带参数可能不是固定的 需要在分享的前一刻才知道 这里就是动态设置分享链接的基本写法 代码不是那么详尽 但大致流程如下 1.安装引用jssdk npm install --save ...
- 【链表】Sort List(归并排序)
题目: Sort a linked list in O(n log n) time using constant space complexity. 思路: nlogn的排序有快速排序.归并排序.堆排 ...