layui框架学习（32：分页模块）

  Layui中的分页模块laypage支持在指定的容器中显示分页信息，主要是指总页数、当前页面、上一页/下一页等信息，可以配合其它组件实现分页显示数据或者分页显示内容，事实上，Layui中的动态数据表格等模块都附带有显示分页功能。laypage分页模块的基本用法及显示效果如下所示：

	<div class="layui-bg-orange layui-border-green" id="MultyPageDemo" style="width: 500px;margin-top: 50px;"></div>
	<script>
		layui.use('laypage', function(){
		  var laypage = layui.laypage;
		  
		  laypage.render({
			elem: 'MultyPageDemo' ,
			count: 750 ,
			limit:50,
			prev:'<',
			next:'>'				
		  });
		});
	</script>

  基础参数limit设置每页显示的数据数量，默认为10，该属性可以直接赋值，也可以通过limits属性设置可选值，通过下拉方式选择limit值；
  基础参数limits设置limit属性的可选值，类似于WInform中设置combobox控件的items属性。注意需在layout属性中设置limit参数才能显示limits对应的下拉框。其用法及效果如下所示：

	laypage.render({
		elem: 'MultyPageDemo' ,
		count: 750 ,
		limit:50,
		limits:[10,20,50,100,200],
		layout: ['prev', 'page', 'next', 'limit'],
		prev:'<',
		next:'>'				
	  });

  基础参数count设置数据总数量，该属性与limit相除即为总页数。
  基础参数groups设置连续出现的页码数量，默认值为5。其效果如下所示：

  基础参数prev/next/first/last设置分页模块中上一页、下一页、首页和尾页按钮的显示名称，这四个按钮的默认名为分别为上一页、下一页、1、总页码值。其用法及效果如下所示（需在layout属性中设置显示相应的按钮）：

	 laypage.render({
		elem: 'MultyPageDemo' ,
		count: 750 ,
		limit:20,
		limits:[10,20,50,100,200],
		prev:'回到上一页',
		next:'跳转到下一页',
		first:'开头页',
		last:'结束页',
		groups:5,
		layout: ['prev', 'page', 'next']
	  });

  基础参数layout设置分页模块的显示内容和显示顺序，为一字符串数组，每个字符串对应按钮或内容，主要包括count（总条目输区域）、prev（上一页区域）、page（分页区域）、next（下一页区域）、limit（条目选项区域）、refresh（页面刷新区域。注意：layui 2.3.0 新增） 、skip（快捷跳页区域）。其用法已在上面列出，在此不再赘述。
  基础参数theme设置分页模块的样式，可以为颜色值，也可以设置为字符串，后者lauui会自动生成 class=“layui-laypage-xxx” 的CSS类，便于自定义主题。其用法及效果如下所示：

	laypage.render({
		elem: 'MultyPageDemo' ,
		count: 750 ,
		limit:20,
		limits:[10,20,50,100,200],
		prev:'回到上一页',
		next:'跳转到下一页',
		first:'开头页',
		last:'结束页',
		groups:5,
		layout: ['prev', 'page', 'next'],
		theme:'#aa00ff'
	  });

  基础参数curr设置默认显示页，默认值为1，同时基础参数hash支持自定义哈希值，该参数配合curr支持刷新页面时自动定位到刷新前的页码，具体可以查看参考文献3中分页示例中的“开启HASH”示例，其它示例刷新后默认显示第1页，而次示例则跳转到刷新前的页面。
  基础参数jump设置切换页面时的事件响应函数，通过该事件可以动态加载切换后页码对应的数据，参考文献3中分页示例中有使用示例，有兴趣的可以参考。

参考文献：
[1]B站：layui框架精讲全套视频教程
[2]https://layui.gitee.io/v2/docs/
[3]https://layui.gitee.io/v2/demo/
[4]https://github.com/layui/layui/