- 详细问题描述:
使用mui.init({
pullRefresh: {
container: '#pullrefresh',
down: {
style: 'circle',
offset: '67px',
callback: pulldownRefresh
},
up: {
contentrefresh: '正在加载...',
callback: pullupRefresh
}
}
});
初始化下拉组件后,在页面创建并打开遮罩层: mui.createMask().show(),
此时,在遮罩层上仍能触发下拉刷新。
2.问题和需求
在有蒙版遮罩的情况下仍然能下拉刷新,此外,在弹出poppicker组件后滑动选项时仍然能触发下拉刷新(此时有蒙版遮罩,场景重现的前提条件是 页面滑动至顶部,即window.pageYOffset=0)
需求,在有遮罩或者弹出poppicker组件时,可以禁止下拉刷新。
3.问题分析
使用mui.init({})方式的下拉刷新,调用mui.js代码部分如下:
_initPulldownRefreshEvent: function() {
var self = this;
$.plusReady(function() {
if(self.options.down.style == "circle"){
//单webview、原生转圈
self.options.webview = plus.webview.currentWebview();
self.options.webview.setPullToRefresh({
support: true,
color:self.options.down.color || '#2BD009',
height: self.options.down.height || '50px',
range: self.options.down.range || '100px',
style: 'circle',
offset: self.options.down.offset || '0px'
}, function() {
self.options.down.callback();
});
......
可以看出,使用的是H5+中webViewObj的setPullToRefresh()初始化下拉组件,mui.js中并没有该下拉刷新事件的监听和判断,H5+中该方法具体实现不详,无法控制 下拉组件的禁止和启用。
即在用mui.init({pullRefresh:{down:{}}})页面初始化时,使用了webview.setPullToRefresh({support:true},function(){})启用下拉刷新,如果我们再在页面手动调用一次
webview.setPullToRefresh({support:false},function(){}),将support设为false,仍不能禁止下拉刷新。
反之,如果第一次setPullToRefresh时support参数设为false,页面不能下拉刷新,再次setPullToRefresh时参数设为true,页面可下拉刷新。
4.问题总结
从目前来看,如果使用H5+的webview下拉加载,一旦初始化后(support为true后),状态将不能再修改。
此外,mui.js下拉刷新时仅仅是调用了H5+中webviewObj的原生下拉,下拉触发、事件监听、样式展示,均不由mui.js控制,而H5+的底层如何实现不得而知
那么,如何禁用和启用此类下拉刷新??
whiteSpaces (作者)
只能换成用mui.pullToRefresh.js实现下拉上拉了 0。0
2017-11-16 10:06