欢迎您访问程序员文章站本站旨在为大家提供分享程序员计算机编程知识!
您现在的位置是: 首页

mui 上拉刷新下拉加载 pullToRefresh

程序员文章站 2024-03-17 11:11:22
...
/**
 * 分页
 */
function pagination() {
	mui('.mui-scroll-wrapper').scroll({
		indicators: true
	}); //初始化scroll组件

	// 刷新组件对象 // 处理中
	var pullToRefresh = mui('#refresh_container').pullToRefresh({
		down: {
			auto: true,
			callback: function() {
				pageNum = 1; //重置页码
				var _self = this;
				var ul = _self.element.querySelector('.pullQuestion');

				load_keywork_data(pageNum, pageSize, ul, 0);
				setTimeout(function() {
					_self.endPullDownToRefresh();
				}, 1000);
			}
		},
		up: {
			auto: true, //默认执行一次上拉加载
			contentinit: '上拉加载更多信息',
			contentdown: '上拉加载结束',
			contentrefresh: '正在加载信息请稍等',
			contentnomore: '没有更多数据',
			callback: function() {
				pageNum += 1; //页码加1
				var _self = this;
				var ul = _self.element.querySelector('.pullQuestion');
				load_keywork_data(pageNum, pageSize, ul, 1);
				setTimeout(function() {
					_self.endPullUpToRefresh(pageNum === totalPage); //最后一页加载完成后禁用上拉	
				}, 1000);
			}
		}
	});
}
function load_keywork_data(p_pageNum, p_pageSize, p_ul, key) {
	var userId = plus.storage.getItem("USERID");
	var dataForm = {
		'userId': userId,
		'rows': p_pageSize,
		'page': p_pageNum,
		'month_': monthDate,
		'sort': 'updatetime',
		'order': 'desc'
	}
	console.log("dataForm:" + JSON.stringify(dataForm));
	fhAjaxSynch("接口", dataForm, "post", 10000, function(_json) {
		if(_json.status == "error") {
			mui.toast(_json.message);
			return;
		} else {
			var jsonData = JSON.parse(_json.data);
			var html = "";
			if(jsonData.rows.length == 0) {
				if(p_pageNum == 1) {
					document.getElementById("segmented").style.display = "none";
					document.getElementById("noDataId").style.display = "";
				}
			} else {
				document.getElementById("segmented").style.display = "";
				document.getElementById("noDataId").style.display = "none";
				var totalRows = jsonData.total;
				if(totalRows % p_pageSize === 0) {
					totalPage = totalRows / p_pageSize;
				} else {
					totalPage = parseInt(totalRows / p_pageSize) + 1;
				}
				var data = jsonData.rows;
				html = int_keywork_hmtl(data);
				if(key == 0) {
					p_ul.innerHTML = html;
				} else {
					p_ul.innerHTML += html;
				}
			}
		}
	});
}

添加筛选条件重新获取数据

//添加searchData自定义事件监听
window.addEventListener('searchData', function(event) {
	//获得事件参数
	monthDate = event.detail.formData;
	pageNum = 1;
	var ul = document.getElementById("keyWorkList");
	load_keywork_data(pageNum, pageSize, ul, 0);
	setTimeout(function() {
		mui('#refresh_container').pullToRefresh().endPullUpToRefresh(pageNum === totalPage); //最后一页加载完成后禁用上拉	
	}, 1000);
});

 

上一篇: 原生 JS 实现轮播图

下一篇: