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 创建对象和构造类实现代码
Jul 30 Javascript
Extjs Label的 fieldLabel和html属性值对齐的方法
Jun 15 Javascript
JavaScript访问字符串中单个字符的两种方法
Jul 03 Javascript
如何屏蔽防止别的网站嵌入框架代码
Aug 24 Javascript
jQuery EasyUi实战教程之布局篇
Jan 26 Javascript
js实现把图片的绝对路径转为base64字符串、blob对象再上传
Dec 29 Javascript
jQuery+SpringMVC中的复选框选择与传值实例
Jan 08 jQuery
JavaScript中this的全面解析及常见实例
May 14 Javascript
微信小程序图表插件wx-charts用法实例详解
May 20 Javascript
关于引入vue.js 文件的知识点总结
Jan 28 Javascript
VSCode写vue项目一键生成.vue模版,修改定义其他模板的方法
Apr 17 Javascript
jQuery中event.target和this的区别详解
Aug 13 jQuery
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中输出转义JavaScript代码的实现代码
2011/04/22 PHP
C# WinForm中实现快捷键自定义设置实例
2015/01/23 PHP
PHP register_shutdown_function()函数的使用示例
2015/06/23 PHP
WordPres对前端页面调试时的两个PHP函数使用小技巧
2015/12/22 PHP
php检测mysql表是否存在的方法小结
2017/07/20 PHP
thinkphp ajaxfileupload实现异步上传图片的示例
2017/08/28 PHP
JavaScript:new 一个函数和直接调用函数的区别分析
2013/07/10 Javascript
jquery利用ajax调用后台方法实例
2013/08/23 Javascript
关于JavaScript和jQuery的类型判断详解
2016/10/08 Javascript
微信小程序之ES6与事项助手的功能实现
2016/11/30 Javascript
ES6新数据结构Set与WeakSet用法分析
2017/03/31 Javascript
CSS3+JavaScript实现翻页幻灯片效果
2017/06/28 Javascript
深入浅析Node.js单线程模型
2017/07/10 Javascript
nodejs基于WS模块实现WebSocket聊天功能的方法
2018/01/12 NodeJs
微信小程序登录换取token的教程
2018/05/31 Javascript
vue 项目地址去掉 #的方法
2018/10/20 Javascript
vue实现分环境打包步骤(给不同的环境配置相对应的打包命令)
2019/06/04 Javascript
js实现搜索提示框效果
2020/09/05 Javascript
[01:08:29]DOTA2-DPC中国联赛定级赛 RNG vs Aster BO3第一场 1月9日
2021/03/11 DOTA
Python实现的数据结构与算法之快速排序详解
2015/04/22 Python
matplotlib绘制动画代码示例
2018/01/02 Python
python对视频画框标记后保存的方法
2018/12/07 Python
Django unittest 设置跳过某些case的方法
2018/12/26 Python
使用python实现ftp的文件读写方法
2019/07/02 Python
python数据分析:关键字提取方式
2020/02/24 Python
Python浮点型(float)运算结果不正确的解决方案
2020/09/22 Python
HTML5 canvas 基本语法
2009/08/26 HTML / CSS
西班牙多品牌鞋店连锁店:Krack
2018/11/30 全球购物
如何写好优秀的创业计划书
2014/01/30 职场文书
巡警年度自我鉴定
2014/02/21 职场文书
2014国庆节主题活动方案:快乐的国庆节
2014/09/16 职场文书
2014年最新领导班子整改方案
2014/09/27 职场文书
学校师德师风整改措施
2014/10/27 职场文书
2014年团总支工作总结
2014/11/21 职场文书
2016年“12.4”法制宣传日活动总结
2016/04/01 职场文书
详解Python+OpenCV进行基础的图像操作
2022/02/15 Python