最近在用Layui做表格数据的展示时想把所有的数据进行分页展示，于是在网上找了一个模板
<script type="text/javascript" >
layui.use(['table','layer','form','laypage'], function(){
var table = layui.table,
layer = layui.layer,
form = layui.form,
laypage = layui.laypage;
table.render({
id:"provinceReload"
,elem: '#complainTable'
,url:'/detection_result_return'
,page: true
,method:'get'
,toolbar: '#complain_toolbar'
,limit:10
,cols: [
[
{checkbox:true}//开启多选框
,{field:'id', width:150,title: 'ID'}
,{field:'serviceCode',width:150, title: '服务编号'}
,{field:'Order',width:150, title: '订单号'}
,{field:'Reason',width:150,title: '原因'}
,{field:'Detail',width:150, title: '详情'}
,{field:'plainState', width:150, title: '状态'}
,{fixed: 'right', title:'操作', toolbar: '#barDemo'}
]
]
,limits: [5,10,20,50]
});
});
</script>注意要将你的url换为你自己的后端接口地址。
过程中遇到了一下问题，解决办法可以参考我的另一篇博客使用layui做表单数据展示时遇到的问题包括layui is not defined，请求异常，错误提示：parsererror，只有表头可以显示出来数据却显示不出-CSDN博客将数据展示出来后却发现并没有分页展示，而是将所有数据都在一页上进行了展示，于是我去了Layui官网寻找原因，我发现模板中Layui分页功能打开了，前端中按钮也已经出现但是点击按钮却没反应，
于是我上网查了才知道分页功能需要自己写代码实现该需求，我们可以按F12键或者右键检查，找到Network，可以发现当我们点击按钮的第几页时，他会向我们设置的后端接口发送一个ajax请求，
其中包括page（第几页）参数以及limit（一页展示几条数据）参数，因此我们可以根据请求中的参数返回该页需要展示的数据。
data_len = len(show_data)
# 获取分页参数
page = request.args.get('page')
limit = request.args.get('limit')
# 分页
page = int(page)
limit = int(limit)
start = (page - 1) * limit
end = page * limit
show_data = show_data[start:end]
# print(show_data)
response_data = {
'code': 0,
'msg': "",
'count': data_len,
'data': show_data
}
return jsonify(response_data)
