Open achuan9 opened 7 years ago
以下暂时通过阻止先上拉再下拉刷新解决了问题,但不是最好的办法。希望作者能找出合理的解决方案。支持!
var pullload = function(opts){
this.config = {};
this.container = null; //具有scroll的容器
this.wrapper = null; //结构外包围元素
this.loaderBody = null; //DOM 对象
this.loaderSymbol = null; //DOM 对象
this.loaderBtn = null; //DOM 对象
this.loaderState = STATS.init;
this.hasMore = true; //是否有加载更多
this.startX = 0; //用于保存touchstart时初始位置
this.startY = 0;//用于保存touchstart时初始位置
this.bugFlag = false; //ioswebView先上拉再下拉出现两层文档
this.init(opts);
} onTouchStart: function(event){ var targetEvent = event.changedTouches[0]; var scrollTop = this.container.scrollTop; this.startX = targetEvent.clientX; this.startY = targetEvent.clientY;
if (scrollTop < 1 && this.bugFlag) this.bugFlag = false;
},
onTouchMove: function(event){
var targetEvent = event.changedTouches[0],
x = targetEvent.clientX,
y = targetEvent.clientY,
scrollTop = this.container.scrollTop,
scrollH = this.container.scrollHeight,
conH = this.container === document.body ? document.documentElement.clientHeight : this.container.offsetHeight;
diffX = x - this.startX,
diffY = y - this.startY;
if (diffY < 0) this.bugFlag = true; //diffy为负数是下拉
//判断垂直移动距离是否大于5 && 横向移动距离小于纵向移动距离
if(Math.abs(diffY) > 5 && Math.abs(diffY) > Math.abs(diffX)){
//滚动距离小于设定值 &&回调onPullDownMove 函数,并且回传位置值
if(diffY > 5 && scrollTop < this.config.offsetScrollTop ){
// //阻止执行浏览器默认动作
if (this.bugFlag) return
event.preventDefault();
this.onPullDownMove(this.startY, y);
} //滚动距离距离底部小于设定值
else if(diffY < 0 && (scrollH - scrollTop - conH) < this.config.distanceBottom ){
//阻止执行浏览器默认动作
event.preventDefault();
this.onPullUpMove(this.startY, y);
}
}
},
onTouchEnd: function(event){
var targetEvent = event.changedTouches[0],
x = targetEvent.clientX,
y = targetEvent.clientY,
scrollTop = this.container.scrollTop,
scrollH = this.container.scrollHeight,
conH = this.container === document.body ? document.documentElement.clientHeight : this.container.offsetHeight;
diffX = x - this.startX,
diffY = y - this.startY;
//判断垂直移动距离是否大于5 && 横向移动距离小于纵向移动距离
if(Math.abs(diffY) > 5 && Math.abs(diffY) > Math.abs(diffX)){
if(diffY > 5 && scrollTop < this.config.offsetScrollTop ){
//回调onPullDownRefresh 函数,即满足刷新条件
if (this.bugFlag) return
this.onPullDownRefresh();
}
}
},
首先感谢您对此组件的肯定。正在回复您,感谢给出的解决方案。不过 markdown 格式有点混乱,欢迎 fork 后 pull request。我会跟进这个问题。
@Seanest 另外能否提供更多关于您使用的 webview 的信息,例如:使用的是 WKWebview 还是 UIWebview?
首先要表示很喜欢此作品,在众多插件中选择了这个。但实际应用中在ios系统webview环境下遇到了一个棘手的bug。 先上拉接着下拉刷新(不要放手),底层会出现重复页面。也请ios开发的同学协助解决,最终还是没能找出一个合理的解决办法