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 相关文章推荐
W3C Group的JavaScript1.8 新特性介绍
May 19 Javascript
dojo随手记 gird组件引用
Feb 24 Javascript
增强用户体验友好性之jquery easyui window 窗口关闭时的提示
Jun 22 Javascript
获取内联和链接中的样式(js代码)
Apr 11 Javascript
使用JavaScript刷新网页的方法
Jun 04 Javascript
本地Bootstrap文件字体图标引入却无法显示问题的解决方法
Apr 18 Javascript
基于 Vue.js 2.0 酷炫自适应背景视频登录页面实现方式
Jan 17 Javascript
微信小程序表单弹窗实例
Jul 19 Javascript
小程序如何写动态标签的实现方法
Feb 05 Javascript
微信小程序开发搜索功能实现(前端+后端+数据库)
Mar 04 Javascript
详解Webpack抽离第三方类库以及common解决方案
Mar 30 Javascript
一文搞懂redux在react中的初步用法
Jun 09 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 数学运算验证码实现代码
2009/10/11 PHP
怎样搭建PHP开发环境
2015/07/28 PHP
WordPress后台中实现图片上传功能的实例讲解
2016/01/11 PHP
php检查函数必传参数是否存在的实例详解
2017/08/28 PHP
Laravel中10个有用的用法小结
2019/05/06 PHP
jQuery 事件队列调整方法
2009/09/18 Javascript
JavaScript 放大镜 放大倍率和视窗尺寸
2011/05/09 Javascript
动态加载js和css(外部文件)
2013/04/17 Javascript
js动态生成指定行数的表格
2013/07/11 Javascript
javascript函数声明和函数表达式区别分析
2014/12/02 Javascript
JS+CSS实现仿触屏手机拨号盘界面及功能模拟完整实例
2015/05/16 Javascript
jquery地址栏链接与a标签链接匹配之特效代码总结
2015/08/24 Javascript
详解jquery easyui之datagrid使用参考
2016/12/05 Javascript
node+vue实现用户注册和头像上传的实例代码
2017/07/20 Javascript
5 种JavaScript编码规范
2018/01/30 Javascript
js实现点击展开隐藏效果(实例代码)
2018/09/28 Javascript
利用Electron简单撸一个Markdown编辑器的方法
2019/06/10 Javascript
jQuery实现鼠标放置名字上显示详细内容气泡提示框效果的方法分析
2020/04/04 jQuery
在Vue 中实现循环渲染多个相同echarts图表
2020/07/20 Javascript
[54:47]Liquid vs VP Supermajor决赛 BO 第五场 6.10
2018/07/05 DOTA
Python网络爬虫神器PyQuery的基本使用教程
2018/02/03 Python
解决安装pycharm后不能执行python脚本的问题
2019/01/19 Python
CSS3之2D与3D变换的实现方法
2019/01/28 HTML / CSS
canvas画图被放大且模糊的解决方法
2020/08/11 HTML / CSS
Silk’n激光脱毛器官网:silkn.com
2016/10/06 全球购物
日本快乐生活方式购物网站:Shop Japan
2018/07/17 全球购物
性能测试工程师的面试题
2015/02/20 面试题
大学生毕业自我评价范文分享
2013/11/11 职场文书
暑期教师培训方案
2014/06/07 职场文书
店铺转让协议书(2014版)
2014/09/23 职场文书
正风肃纪剖析材料
2014/09/30 职场文书
大一新生检讨书
2014/10/29 职场文书
客房领班岗位职责
2015/02/11 职场文书
新郎结婚感言
2015/07/31 职场文书
PyTorch梯度裁剪避免训练loss nan的操作
2021/05/24 Python
nginx之queue的具体使用
2022/06/28 Servers