layui 表格详解

layui.use('table', function () {

        var layer = parent.layer === undefined ? layui.layer : top.layer;
                     var table = layui.table;

        //loading
        var tableLoading = layer.load(0,{
            shade:false
        });

         /*第一种原始写法*/
         /*
         table.render({
             id: 'laydictsList',
             elem: '#test',
             url: areasURL + "/base_dics/LayuigetPageList",
             cellMinWidth: 80,//全局定义常规单元格的最小宽度，layui 2.2.1 新增
             where: { txtFullName: null },
             page: true,
             //toolbar:'barDemo',
             limit: 10,
             limits: [2, 5, 10, 20, 30],
             text: {
                 none: '暂无相关数据！'//默认无数据
             },
            done:function (res){ //结束loading
                layer.close(tableLoading);
            },
             cols: [[
               { type: 'checkbox', LAY_CHECKED: false },
               { field: 'dicsid', width: 80, title: 'ID', sort: true, hide: true },
               { field: 'code', width: 80, title: '编号' },
               { field: 'sortnum', width: 80, title: '序号', sort: true },
               { field: 'fullname', width: 80, title: '名称' },
               { field: 'diccategoryname', title: '所属类别',
               width: '30%', minWidth: 100 }, //minWidth：局部定义当前单元格的最小宽度，
               layui 2.2.1 新增
               { field: 'experience', title: '操作' }
             ]]
         });
     });
     */
         /*第二种改进版*/
         table.render({
             id: 'laydictsList',
             elem: '#test',
             url: areasURL + "/base_dics/getPageList",
             method: "post",
             request: {
                      pageName: 'PageNum', //页码的参数名称，默认：page
                 limitName: 'PageSize' //每页数据量的参数名，默认：limit
             },
             response: {
                      statusName: 'ReturnType', //数据状态的字段名称，默认：code
                 statusCode: true,//成功的状态码，默认：0
                 msgName: 'ReturnMsg', //状态信息的字段名称，默认：msg
                 countName: 'ReturnCount', //数据总数的字段名称，默认：count
                 dataName: 'ReturnData', //数据列表的字段名称，默认：data
             },
             cellMinWidth: 80,//全局定义常规单元格的最小宽度，layui 2.2.1 新增
             where: { txtFullName: null },
             page: true,
             //toolbar:'barDemo',
             limit: 10,
             limits: [2, 5, 10, 20, 30],
             text: {
                     none: '暂无相关数据！'//默认无数据
             },
             cols: [[
                    { type: 'checkbox', LAY_CHECKED: false },
               { field: 'dicsid', width: 80, title: 'ID', sort: true, hide: true },
               { field: 'code', width: 80, title: '编号' },
               { field: 'sortnum', width: 80, title: '序号', sort: true },
               { field: 'fullname', width: 80, title: '名称' },
               { field: 'diccategoryname', title: '所属类别',
               width: '30%', minWidth: 100 }, //minWidth：局部定义当前单元格的最小宽度，
               layui 2.2.1 新增
               { field: 'experience', title: '操作' }
             ]]
         });
     });