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

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

二、再然后就是给table命名layui特定的名称

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

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

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

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

//表命名 
 <table class="layui-hide" id="LAY_table_user" lay-filter="user"></table>
//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 '<label id="id' + d.id + '" class="layui-table-cell laytable-cell-2-0-2">' + d.id + '</lable>';
                            }
                        }
                    , {
                        field: 'plateno', title: '车牌号', width: 200, sort: true,
                        templet: function (d) {
                            return '<label id="plateno' + d.id + '" class="layui-table-cell laytable-cell-2-0-2">' + d.plateno + '</lable>';
                        }
                    }
                    , {
                        field: 'vehiclemodel', title: '车型', width: 200, sort: true,
                        templet: function (d) {
                            return '<label id="vehiclemodel' + d.id + '" class="layui-table-cell laytable-cell-2-0-2">' + d.vehiclemodel + '</lable>';
                        }
                    }
                    , {
                        field: 'fueltype', title: '能源', width: 100, sort: true,
                        templet: function (d) {
                            return '<label id="fueltype' + d.id + '" class="layui-table-cell laytable-cell-2-0-2">' + d.fueltype + '</lable>';
                        }
                    }
                    , {
                        field: 'vin', title: '车架号', width: 100, sort: true,
                        templet: function (d) {
                            return '<label id="vin' + d.id + '" class="layui-table-cell laytable-cell-2-0-2">' + d.vin + '</lable>';
                        }
                    }
                    , {
                        field: 'auditStatus', title: '审核状态', width: 100, sort: true,
                        templet: function (d) {
                            var auditStatus = "";
                            if (d.auditStatus == 1) {
                                auditStatus = "待审核";
                            }
                            else if (d.auditStatus == 2) {
                                auditStatus = "审核通过";
                            }
                            else if (d.auditStatus == 3) {
                                auditStatus = "审核不通过";
                            }
                            return '<label id="auditStatus' + d.id + '" class="layui-table-cell laytable-cell-2-0-2">' + auditStatus + '</lable>';
                        }
                    }
                    , {
                        field: 'wjResult', title: '外检结果', width: 100, sort: true,
                        templet: function (d) {
                            var wjResult = "";
                            if (d.wjResult == 0) {
                                wjResult = "不合格";
                            }
                            else if (d.wjResult == 1) {
                                wjResult = "合格";
                            }

                            return '<label id="wjResult' + d.id + '" class="layui-table-cell laytable-cell-2-0-2">' + wjResult + '</lable>';
                        }
                    }
                    , {
                        field: 'repulseDesc', title: '审核描述', width: 100, sort: true,
                        templet: function (d) {
                            return '<label id="repulseDesc' + d.id + '" class="layui-table-cell laytable-cell-2-0-2">' + d.repulseDesc + '</lable>';
                        }
                    }
                    , { field: 'regtime', title: '时间', width: 200, sort: true, }
                    , {
                        width: 150, title: '操作', width: 200, sort: true, fixed: 'right'
                    , templet: function (d) {
                        var html = '';
                        var addBtn = '<a class="layui-btn layui-btn-danger layui-btn-xs" ID="No' + d.id + '" onclick="func7(\'' + d.id + '\')" vaeyo_tab vae-id="1000" vae-title="查看"  >查看</a>';
                        return addBtn;
                    }
                    }
              ]]