layui table自定义渲染布局和替换布局的差异

一、首先引用layui.js文件和layui.css,反正就是layui官网下载的那一个包,当然我本人也没有进行识别,需要什么就引用什么

二、再然后就是给table命名layui特定的名称layui table自定义渲染布局和替换布局的差异_第1张图片

三、在加载完成后进行方法级渲染

layui table自定义渲染布局和替换布局的差异_第2张图片

及layui.table.render;elem属性为table对应名称;URL即为链接地址;where是上传给接口的json数据;method则是请求接口的方式

四、最重要的还是最后的clos定义:

layui table自定义渲染布局和替换布局的差异_第3张图片

title决定该列的表头,templet返回的数据则是html代码,对该列的布局。难度系数不大,对着以下copy:

//表命名 
 
//JS渲染 var table = layui.table; //方法级渲染 table.render({ elem: '#LAY_table_user' , url: '' + urlipport + '/api/jczapp/reginfoList' , method: 'post', where: { pageNumber: 1, pageSize: 15, filterName: "" } , response: { statusName: 'code', statusCode: 200 } , parseData: function (res) { return { "code": res.code, "data": res.data.list }; } , cols: [[ { type: 'checkbox', fixed: 'left', }, { title: '编号', width: 200, sort: true, fixed: 'left', templet: function (d) { return '

 

 

 

 

你可能感兴趣的:(前端)