【文档】mui.pullToRefresh插件

下拉刷新和上拉加载，是大部分应用中都会用到的功能。
mui结合html5plus的API，封装了一套可以在Android和iOS上实现的配置，详细参考mui相关文档。

为了方便开发wap站的开发者，mui还扩展了pullToRefresh插件。

依赖

• mui.js
• mui.pullToRefresh.js
• mui.pullToRefresh.material.js

同样，和其它一些插件一样，在HBuilder中新建hello mui示例工程，或在在github上均可获取以上资源。

初始化组件

初始化方法

var pullToRefresh = mui(selector).pullToRefresh(options);  

配置信息

下拉配置

down: {  
    callback: function(){} //下拉回调函数  
}  

目前下拉只有这一个配置项，下拉的动画是canvas绘制的，想调整的话需要修改mui.pullToRefresh.material.js中的相关代码。

上拉配置

up: {  
    callback: function(){}, //上拉回调，必填；  
    auto: false, //自动执行一次上拉加载，可选；  
    show: true, //显示底部上拉加载提示信息，可选；  
    contentinit: '上拉显示更多', //可以上拉提示信息  
    contentdown: '上拉显示更多', //上拉结束提示信息  
    contentrefresh: '正在加载...', //上拉进行中提示信息  
    contentnomore: '没有更多数据了' //上拉无更多信息时提示信息  
}  

常用API

下拉相关

手动触发下拉

pullToRefresh.pullDownLoading();  

结束下拉

pullToRefresh.endPullDownToRefresh();  

上拉相关

手动触发上拉

pullToRefresh.pullUpLoading();  

结束上拉

pullToRefresh.endPullUpToRefresh(Boolean); //传true代表无更多信息，默认可不传；  

禁用/开启组件

pullToRefresh.setStopped(Boolean);  

刷新组件

上拉的操作，如果无更多信息后，调用结束上拉并且传true会禁用上拉。如果需要重新开启上拉，则需要刷新组件。

pullToRefresh.refresh(true);  

结尾

附件中提供了一个简单的，使用mui.pullToRefresh制作的例子。多个选项卡的情景，请参考hello mui示例中的pullrefresh_with_tab.html。