微信小程序开发时,上拉加载和下拉刷新效果让人眼前一亮,挺棒的。不过小程序里只需要在js文件用onPullDownRefresh命名的方法就可以实现了,忒方便。在微信开发或者手机端网页开发呢。
1.借助插件
dropload
mui
后者是做前台/手机端app的一个框架
2.借助js代码
需先引入jquery (直接百度jq,然后点进去一个网站,查看源代码,复制引入jq的那句script代码)
$(window).scroll(function(){
console.log('正在滑动f');
var scrollTop = $(this).scrollTop(); //滚动条距离顶部的高度
var scrollHeight = $(document).height(); //当前页面的总高度
var clientHeight = $(this).height(); //当前可视的页面高度
if(scrollTop + clientHeight >= scrollHeight){ //距离顶部+当前高度 >=文档总高度 即代表滑动到底部 count++; //每次滑动count加1
// filterData(serviceTypeId,industryId,cityId,count); //调用筛选方法,count为当前分页数
console.log('下拉bottom');
}else if(scrollTop<=0){
//滚动条距离顶部的高度小于等于0 TODO
//alert("下拉刷新,要在这调用啥方法?");
console.log('上拉top');
}
});