layui中laypage组件的使用方法-创新互联
laypage 的使用非常简单,指向一个用于存放分页的容器,通过服务端得到一些初始值,即可完成分页渲染。核心方法: laypage.render(options) 来设置基础参数。
员工经过长期磨合与沉淀,具备了协作精神,得以通过团队的力量开发出优质的产品。成都创新互联公司坚持“专注、创新、易用”的产品理念,因为“专注所以专业、创新互联网站所以易用所以简单”。公司专注于为企业提供网站建设、网站设计、微信公众号开发、电商网站开发,微信小程序开发,软件按需求定制网站等一站式互联网企业服务。一、laypage的常用基础参数
layui.use(['laypage'], function () { laypage = layui.laypage laypage.render({ elem: 'pageTest' //这是元素的id,不能写成"#pageTest" , count: data.length //数据总数 , limit: 10 //每页显示条数 , limits: [10, 20, 30] , curr: 1 //起始页 , groups: 5 //连续页码个数 , prev: '上一页' //上一页文本 , netx: '下一页' //下一页文本 , first: 1 //首页文本 , last: 100 //尾页文本 , layout: ['prev', 'page', 'next','limit','refresh','skip'] //跳转页码时调用 , jump: function (obj, first) { //obj为当前页的属性和方法,第一次加载first为true // do something if (!first) { //非首次加载 do something } } }) });
二、使用方式
在layui中的table中包含了laypage,这里就不再说明laytable中的分页用法,主要写一个后台分页,前端加载列表(非table中的列表)的栗子,具体为点击分类栏,主体部分显示对应的新闻列表。
- 新闻分类1
- 新闻分类2
- 新闻分类3
- 新闻分类4
新闻分类1
以上就是layui laypage组件常见用法总结的详细内容,更多请关注创新互联网站制作公司其它相关文章!
文章标题:layui中laypage组件的使用方法-创新互联
本文路径:http://pwwzsj.com/article/ipohs.html