@下拉刷新
条件:
1 起始点:当鼠标按下去的那个点 startY
2 结束点: 当鼠标按下拖动后松开的点 pagaY
3 距离:distance=结束点-起始点
4 盒子的偏移量:offsetTop
let dropRefresh=(ele:any)=>{
let startY:any,
distance,
initTop=ele.offsetTop;
let touchStart=(e:any)=>{
startY=e.targetTouches[0].pageY;
ele.addEventListener('touchmove',touchMove);
ele.addEventListener('touchend',touchEnd);
};
let touchMove=(e:any)=>{
let pageY=e.targetTouches[0].pageY;
if(pageY>startY){
distance=pageY-startY;
ele.style.top=distance+initTop+'px';
}else{
ele.removeEventListener('touchmove',touchMove);
ele.removeEventListener('touchend',touchEnd);
}
};
let touchEnd=(e:any)=>{
let timer:any;
ele.removeEventListener('touchmove',touchMove);
ele.removeEventListener('touchend',touchEnd);
timer=setInterval(()=>{
if(initTop+1==ele.offsetTop&&ele.scrollTop==0){
clearInterval(timer);
}
ele.style.top=ele.offsetTop-1+'px';
},5)
};
ele.addEventListener('touchstart',touchStart);
};
export default dropRefresh;
随手记录!