React Native中的RefreshContorl下拉刷新使用


Posted in Javascript onOctober 09, 2017

我们知道App中都有下拉加载,在React Native中也有类似的控件

一、属性方法

(1) onRefresh function 在视图开始刷新的时候调用

(2) refreshing bool 视图是否在刷新时显示指示器,也表明当前是否在刷新中

(3) colors [ColorPropType] android平台适用 进行设置加载进去指示器的颜色,至少设置一种,最多可以设置4种

(4) enabled bool android平台适用 用来设置下拉刷新功能是否可用

(5) progressBackgroundColor ColorPropType 设置加载进度指示器的背景颜色

(6) size RefreshLayoutConsts.SIZE.DEFAULT android平台适用 加载进度指示器的尺寸大小

(7) tintColor ColorPropType iOS平台适用 设置加载进度指示器的颜色

(8)title string iOS平台适用 设置加载进度指示器下面的标题文本信息

二、使用方法

<ScrollView
    refreshControl={
     <RefreshControl
      refreshing={this.state.isRefreshing}
      onRefresh={this._onRefresh}
      tintColor="#ff0000"
      title="Loading..."
      titleColor="#00ff00"
      colors={['#ff0000', '#00ff00', '#0000ff']}
      progressBackgroundColor="#ffff00"
     />
    }
/>
 
_onRefresh() {
     this.setState({
       isRefreshing:true
     });
     
     var self = this;
     setTimeout(()=>{
 
      //加载数据
     },2000)
}

这样就出现加载效果了

以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持三水点靠木。

Javascript 相关文章推荐
Javascript 获取链接(url)参数的方法[正则与截取字符串]
Feb 09 Javascript
js模拟类继承小例子
Jul 17 Javascript
理解Javascript_01_理解内存分配原理分析
Oct 11 Javascript
suggestion开发小结以及对键盘事件的总结(针对中文输入法状态)
Dec 20 Javascript
js关闭当前页面(窗口)的几种方式总结
Mar 05 Javascript
JS获取当前日期时间并定时刷新示例
Mar 04 Javascript
js闭包实例汇总
Nov 09 Javascript
JS实现的网页背景闪电闪烁效果代码
Oct 17 Javascript
详解原生JavaScript实现jQuery中AJAX处理的方法
May 10 Javascript
深入理解Commonjs规范及Node模块实现
May 17 Javascript
JS中数组实现代码(倒序遍历数组,数组连接字符串)
Dec 29 Javascript
js实现磁性吸附的示例
Oct 26 Javascript
JS实现的全排列组合算法示例
Oct 09 #Javascript
js + css实现标签内容切换功能(实例讲解)
Oct 09 #Javascript
jQuery ajax调用webservice注意事项
Oct 08 #jQuery
js用类封装pop弹窗组件
Oct 08 #Javascript
利用js编写网页进度条效果
Oct 08 #Javascript
MUI顶部选项卡的用法(tab-top-webview-main)详解
Oct 08 #Javascript
JS动态修改网页body的背景色实例代码
Oct 07 #Javascript
You might like
PHP下一个非常全面获取图象信息的函数
2008/11/20 PHP
PHP独立Session数据库存储操作类分享
2014/06/11 PHP
php关联数组快速排序的方法
2015/04/17 PHP
php验证邮箱和ip地址最简单方法汇总
2015/10/30 PHP
PHP上传图片时判断上传文件是否为可用图片的方法
2016/10/20 PHP
Yii2.0多文件上传实例说明
2017/07/24 PHP
启用OPCache提高PHP程序性能的方法
2019/03/21 PHP
IE autocomplete internet explorer's autocomplete
2007/06/30 Javascript
Jquery 基础学习笔记之文档处理
2009/05/29 Javascript
javascript中Date对象的getDay方法使用指南
2014/12/22 Javascript
JavaScript实现的多个图片广告交替显示效果代码
2015/09/04 Javascript
jquery弹出遮掩层效果【附实例代码】
2016/04/28 Javascript
javascript中Number的方法小结
2016/11/21 Javascript
JS实现标签页切换效果
2017/05/04 Javascript
JS表单传值和URL编码转换
2018/03/03 Javascript
vue+Element-ui实现分页效果实例代码详解
2018/12/10 Javascript
JavaScript怎样在删除前添加确认弹出框?
2019/05/27 Javascript
JavaScript实现页面中录音功能的方法
2019/06/04 Javascript
解决vuex刷新状态初始化的方法实现
2019/08/15 Javascript
微信小程序列表时间戳转换实现过程解析
2019/10/12 Javascript
[01:23:59]2018DOTA2亚洲邀请赛 4.1 小组赛 B组 VP vs Secret
2018/04/03 DOTA
python编写暴力破解FTP密码小工具
2014/11/19 Python
python代码实现ID3决策树算法
2017/12/20 Python
Python request设置HTTPS代理代码解析
2018/02/12 Python
pandas重新生成索引的方法
2018/11/06 Python
浅谈Pycharm调用同级目录下的py脚本bug
2018/12/03 Python
Python使用matplotlib绘制Logistic曲线操作示例
2019/11/28 Python
pytorch 数据处理:定义自己的数据集合实例
2019/12/31 Python
DC Shoes官网:美国滑板鞋和服饰品牌
2017/09/03 全球购物
亿阳信通股份有限公司笔试题(C#)
2016/03/04 面试题
2015年社区创卫工作总结
2015/04/21 职场文书
2015年售票员工作总结
2015/04/29 职场文书
孔子观后感
2015/06/08 职场文书
python中如何对多变量连续赋值
2021/06/03 Python
Spring mvc是如何实现与数据库的前后端的连接操作的?
2021/06/30 Java/Android
JavaGUI模仿QQ聊天功能完整版
2021/07/04 Java/Android