博客
关于我
强烈建议你试试无所不能的chatGPT,快点击我
mui 上拉加载更多
阅读量:6224 次
发布时间:2019-06-21

本文共 1067 字,大约阅读时间需要 3 分钟。

看起来很简单的东西,实践过程中还是出现了很多麻烦,比如上拉时,状态条跑到了顶部,因为内容没有添加到容器中,再比如下拉的回调函数使用问题,this的传递。

html实现部分:

js代码的实现过程:

mui.init({    pullRefresh : {        container:"#refreshContainer",//待刷新区域标识,querySelector能定位的css选择器均可,比如:id、.class等        up : {            height:50,// 可选.默认50.触发上拉加载拖动距离            auto:false,// 可选,默认false.自动上拉加载一次            contentrefresh : "正在加载...",// 可选,正在加载状态时,上拉加载控件上显示的标题内容            contentnomore:'没有更多数据了',// 可选,请求完毕若没有更多数据时显示的提醒内容;            callback : function() {                var self = this; // 这里的this == mui('#refreshContainer').pullRefresh()                // 加载更多的内容                loadMore(this);            } //必选,刷新函数,根据具体业务来编写,比如通过ajax从服务器获取新数据;        }    }});// var loadMore = function(pullRefresh) {    // 加载更多的内容到列表中    // TODO    // 如果没有更多数据了,则关闭上拉加载    pullRefresh.endPullupToRefresh(true);    // 如果有更多数据,则继续    pullRefresh.endPullupToRefresh(false);};

 

转载于:https://www.cnblogs.com/crazycode2/p/6879337.html

你可能感兴趣的文章
敏捷测试理论以及实践(4)
查看>>
Windows 10新版15058推送:RS2准正式、无水印
查看>>
"勒索病毒"推高国内比特币价格 最高已超17000元
查看>>
一个页面标题和过滤输出的解决方案(上)
查看>>
你得小心BYOD这10个陷阱!
查看>>
CRM系统能给企业带来什么样的价值?
查看>>
浙江绍兴将出台《意见》推进光伏发电
查看>>
Java访问控制权限
查看>>
理解 Rack 应用及其中间件
查看>>
《Hadoop与大数据挖掘》一2.2.4 动手实践:一键式Hadoop集群启动关闭
查看>>
《大数据云计算时代 数据中心经典案例赏析》——导读
查看>>
IBM 拉开裁员大幕 或波及上万员工
查看>>
天猫618再砸数亿 ,家电不论大小只要比京东贵就赔
查看>>
《实施Cisco统一通信管理器(CIPT1)》——导读
查看>>
Google:我们用一条公式成功增强了 Android 的安全性
查看>>
《CCNP SWITCH 300-115认证考试指南》——1.6节定义关键术语
查看>>
《编写高质量代码:改善c程序代码的125个建议》——建议3-4:避免直接在浮点数中使用“==”操作符做相等判断...
查看>>
《软件开发践行录——ThoughtWorks中国区文集》一一2.1 项目背景
查看>>
一位开发者的 Linux 容器之旅
查看>>
《实践者的研究方法》—— 第2章 软件工程 2.3 软件工程实践
查看>>