layui分页调用方法

let rel_params = {page:1}, list_data = '', list_length = 0, curr = 1;

function getData(params) {

$.ajax({
type: 'POST',
url: '接口地址',
data: params,
success: function (ret) {
console.log(ret)
if (ret.code == 0) {
list_data = ret.data;
list_length = ret.count;
loadPage();
} else {
layer.msg(ret.msg, {offset: '15px', icon: 2, time: 1000});
}
}
});
}
getData(rel_params);

window.loadPage = function(){
laypage.render({
elem: 'my-page-box'  //页数显示box
,count: list_length  //总数据条数
,limit: 20  // 一页显示条数
,curr:curr  //当前第几页
,jump: function(obj,first){
console.log(list_data, list_length);
if(first){
//模拟渲染
document.getElementById('my-body').innerHTML = function(){
var arr = []
// ,thisData = list_data.concat().splice(obj.curr*obj.limit - obj.limit, obj.limit);
layui.each(list_data, function(i, item){
// console.log(i, item)
arr.push('<ul class="list display-row">'+
'<li>'+
'<div class="display-row"><span class="my-tip">&nbsp;</span><span class="my-font-sm m-b">'+ item.title + (item.spec ? '-' + item.spec : '') +'</span></div>'+
'<div class="display-row" style="align-items:center;"><span class="my-tip color-blue">' + item.number + '</span><span class="my-bar my-bg-blue" style="width:' + item.number_percentage + '%;"></span></div>'+
'<div class="display-row" style="align-items:center;"><span class="my-tip color-yellow">' + item.sum_number + '</span><span class="my-bar my-bg-yellow" style="width:' + item.sum_number_percentage + '%;"></span></div>'+
'</li>'+
'<li><span style="width:100%; text-align:left;">'+ item.title + (item.spec ? '-' + item.spec : '') +'</span></li>'+
'<li>' + item.goodssn + '</li>'+
'<li>'+item.number+'</li>'+
'<li>' + item.sum_number + '</li>'+
'<li>' + parseInt(item.sum_money * 100) / 100 + '</li>'+
'</ul>');
});
return arr.join('');
}();
}else{
console.log('b')
rel_params.page = obj.curr;
curr = obj.curr;
getData(rel_params);
}
}
});
}

 

上一篇:Leetcode 反转链表 ||


下一篇:程序员面试金典 面试题 04.01. 节点间通路