//原本就有的部分
HWCompositing: true,
useTransition: true,
useTransform: true,
//我加入的部分
minScrollY : 0,
minScrollX : 0
2、在下面不远处(十行以内)加入如下参数:
//新加部分
this.minScrollY = this.options.minScrollY
this.minScrollX = this.options.minScrollX
原先就有的部分
this.translateZ = this.options.HWCompositing &&utils.hasPerspective ? ' translateZ(0)' : ''
3、最后一处修改,在resetPosition方法内,此处直接贴上更改之后的方法,其实真正的修改只是将this.minScrollX修改成了(代码在2830行左右):
resetPosition: function (time) {
var x = this.x,
y = this.y
time = time || 0
if ( !this.hasHorizontalScroll || this.x >this.minScrollX ) {
x = this.minScrollX
} else if ( this.x <this.maxScrollX ) {
x = this.maxScrollX
}
if ( !this.hasVerticalScroll || this.y >this.minScrollY ) {
y = this.minScrollY
} else if ( this.y <this.maxScrollY ) {
y = this.maxScrollY
}
if ( x == this.x &&y == this.y ) {
return false
}
this.scrollTo(x, y, time, this.options.bounceEasing)
return true
},
全部修改内容如上,调用的时候,只需要传入minScrollX、minScrollY参数便可实现下拉后回弹上面的预留位置了。
注:对于scroll的滚动区域小于包裹容器的,iscroll禁止滚动,会造成无法实现下拉刷新,这里有一个小技巧,就是给滚动区域加一个min-height:101%
我也是找了好久这个。看了楼上@海农的答案。想了想按照如下方式应该更好一点。代码中 this.y-minY>10 这里的10是加载阈值(可以理解为滚动元素下边缘离开父容器下边缘),可以实际情况自行调整。
myScroll.on('scrollStart', function() {
minY = this.y // console.log(this)})
myScroll.on('scroll', function() {
minY = minY<this.y ? minY : this.y // console.log(this)})
myScroll.on('scrollEnd', function() {
minY = minY<this.y ? minY : this.y //
if (this.y-minY>10 &&(this.directionY===1)) {//加载
}
})
只在scrollStart和scrollEnd中判断有个小情况应该是不能处理,假如滚动元素目前位置没有达到最底部,猛的向上一划,最底下的元素会滑动到离开父容器底部一段距离,这时候应该加载新数据,但是pullStart 并不等于 this.y,所以不会加载新数据。