layUI分页处理--乐字节前端_教程

<font color="red">模块加载名称： laypage </font>

laypage 的使用非常简单，指向一个用于存放分页的容器，通过服务端得到一些初始值，即可完成分页渲染。

通过核心方法： laypage.render(options) 来设置基础参数。

当分页被切换时触发，函数返回两个参数： obj （当前分页的所有选项值）、first（是否首次，一般用于初始加载的判断）

<font color="red">模块加载名称： table </font>

创建一个table实例最简单的方式是，在页面放置一个元素 <table id="demo"></table>，然后通过 table.render() 方法指定该容器。

数据接口 user.json

在一段 table 容器中配置好相应的参数，由 table 模块内部自动对其完成渲染，而无需你写初始的渲染方法。

1) 带有 class="layui-table" 的 <table> 标签。

2) 对标签设置属性 lay-data="" 用于配置一些基础参数

3) 在 <th> 标签中设置属性 lay-data="" 用于配置表头信息

页面已经存在了一段有内容的表格，由原始的table标签组成，只需要赋予它一些动态元素。

执行用于转换表格的JS方法

首先看你的的控制台有没有报错加载不到layer.js或者form.js

然后你的整个表单必须有form层

我把代码和整个目录结构给你看

1、目录结构

请点击输入图片描述

2、代码

<!DOCTYPE html>

<html>

<head>

</head>

</div>

</select>

</div>

</div>

</div>

</div>

</form>

//一般直接写在一个js文件中

layui.use(['layer', 'form'], function(){

var layer = layui.layer

,form = layui.form

layer.msg('Hello World')

})

</script>

</body>

</html>

3、结果图

请点击输入图片描述

方法1：使用字符实体

只需要在一个class为 layui-icon 的容器类标签中加入字符的unicode码即可。

相关样式：layui-icon，代表使用layui的图标处理样式去渲染

方法2：使用样式

在class为layui-icon的容器类标签后追加对应的图标样式，而不需要在写unicode码。

相关图标样式可以去官网的文档查找。

layUI分页处理--乐字节前端

发表评论

评论列表（0条）