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数组长度问题代码说明
Jan 20 Javascript
超级简单的jquery操作表格方法
Dec 15 Javascript
jQuery中odd选择器的定义和用法
Dec 23 Javascript
jQuery mobile转换url地址及获取url中目录部分的方法
Dec 04 Javascript
Flow之一个新的Javascript静态类型检查器
Dec 21 Javascript
使用Javascript实现选择下拉菜单互移并排序
Feb 23 Javascript
jQuery基于函数重载实现自定义Alert函数样式的方法
Jul 27 Javascript
D3.js实现饼状图的方法详解
Sep 21 Javascript
微信小程序 侧滑删除(左滑删除)
May 23 Javascript
JavaScript基于面向对象实现的猜拳游戏
Jan 03 Javascript
JavaScript函数的特性与应用实践深入详解
Dec 30 Javascript
JavaScript实现复选框全选和取消全选
Nov 20 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实现获取局域网所有用户的电脑IP和主机名、及mac地址完整实例
2014/07/18 PHP
php模仿qq空间或朋友圈发布动态、评论动态、回复评论、删除动态或评论的功能(中)
2017/06/11 PHP
PHP面向对象五大原则之开放-封闭原则(OCP)详解
2018/04/04 PHP
Javascript 更新 JavaScript 数组的 uniq 方法
2008/01/23 Javascript
JavaScript 继承详解(三)
2009/07/13 Javascript
基于jQuery的简单九宫格实现代码
2012/08/09 Javascript
jQuery使用技巧简单汇总
2013/04/18 Javascript
js data日期初始化的5种方法
2013/12/29 Javascript
JavaScript实现为指定对象添加多个事件处理程序的方法
2015/04/17 Javascript
javascript多行字符串的简单实现方式
2015/05/04 Javascript
JavaScript调用浏览器打印功能实例分析
2015/07/17 Javascript
JS实现自定义简单网页软键盘效果代码
2015/11/05 Javascript
jQuery实现验证码功能
2017/03/17 Javascript
vue滚动轴插件better-scroll使用详解
2017/10/17 Javascript
[03:45]Newbee战队出征西雅图 决战2016国际邀请赛
2016/08/02 DOTA
在Python中操作时间之mktime()方法的使用教程
2015/05/22 Python
启动targetcli时遇到错误解决办法
2017/10/26 Python
利用Python如何将数据写到CSV文件中
2018/06/05 Python
Python多线程原理与用法实例剖析
2019/01/22 Python
浅析python中的del用法
2020/09/02 Python
python super()函数的基本使用
2020/09/10 Python
美国顶尖折扣时尚购物网:Bluefly
2016/08/28 全球购物
英国天然保健品网站:Simply Supplements
2017/03/22 全球购物
匡威德国官网:Converse德国
2019/01/26 全球购物
Aurora London官网:奢华、负担得起的皮革手袋
2020/08/01 全球购物
索引覆盖(Index Covering)查询含义
2012/02/18 面试题
环境工程专业个人求职信
2013/12/05 职场文书
感恩母亲节活动方案
2014/03/04 职场文书
新闻编辑求职信
2014/04/09 职场文书
学习雷锋寄语大全
2014/04/11 职场文书
十佳家长事迹材料
2014/08/26 职场文书
正风肃纪查摆剖析材料
2014/10/10 职场文书
2015年学校信息技术工作总结
2015/05/25 职场文书
就业推荐表院系意见
2015/06/05 职场文书
MySQL官方导出工具mysqlpump的使用
2021/05/21 MySQL
浅谈TypeScript 索引签名的理解
2021/10/16 Javascript