layui数据表格layui.table.render

通过一个简要的例子来介绍一下相关功能。主要我写项目中常用的属性和方法都介绍出来了，如果需要其他功能，可以看看官网。
页面

<table id="demo" lay-filter="demo_table_filter"></table>

<script>
layui.use('table', function(){
  var demoTable = table.render({
    elem: '#demo',  //指定原始 table 容器的选择器或 DOM，方法渲染方式必填
    height: 312,  //设定容器高度(如果设置滚动条，必须定高)
    url: '/demo/table/user/', //数据接口
    method:'post', //请求方式
    parseData: function (res) {  
      //res是请求返回的数据，可以在parseData中对数据进行一些处理，返回layui要求的格式
      /*
      ......
      */
      return {
        'code': 0, //接口状态
        'msg': '', //提示文本
        'count': res.length, //数据长度
        'data': res //数据列表，是直接填充进表格中的数组
      }
    },
    request: { //当接口需要请求参数时，在这修改
    pageName: 'newName' //开始的页码的参数名称，默认：page
    ,limitName: 'newNumber' //每页数据量的参数名，默认：limit
  },
  //这里添加接口需要的除页码页号外的参数。如果无需传递额外参数，可不加该参数
  where: {token: 'sasasas', id: 123}, 
  page: { //表格添加分页的，如果不需要分页，可以不添加page属性
     layout: ['prev', 'page', 'next', 'skip', 'limit', 'count'], //自定义分页布局
      curr: 0, //设定初始在第 0 页，从第0页开始
      limit: 15, //每页显示15条数据
      groups: 5, //只显示 1 个连续页码
      first: false, //不显示首页
      last: false, //不显示尾页
  },
  cols: [[ //表头
 	   //res数组的每一条对象中，属性名和field相同，就自动填充。
    {field: 'id', title: 'ID', width:80, sort: true, fixed: 'left'} 
    ,{field: 'username', title: '用户名', width:80}
    ,{field: 'sex', title: '性别', width:80, sort: true}
    ,{field: 'city', title: '城市', width:80} 
    ,{field: 'sign', title: '签名', width: 177}
    ,{field: 'experience', title: '积分', width: 80, sort: true}
    ,{field: 'score', title: '评分', width: 80, sort: true}
    ,{field: 'classify', title: '职业', width: 80}
    ,{field: 'wealth', title: '财富', width: 135, sort: true}
    ,{ //表格最后一栏如果是操作栏，可以删除和修改
        field: 'opt',
        minWidth: '150',
        title: '操作',
        templet: function (d) {
          return ` 
刪除
                    
修改
`;
        }
      }
  ]]
  }); 
});
</script>

关于表格操作

// 表格操作
	//table元素中lay-filter属性的参数名↓
  layui.table.on('tool(demo_table_filter)', function (obj) {
    var data = obj.data;
    if (obj.event === 'demo_table_delete') {
      layer.confirm('确定删除此数据吗？', { closeBtn: 0, title: false, icon: 3, btn: ['确定', '取消'] }, function (deleteLayer) {
        var index = layer.load(0, { shade: 0.1 });
        api.holidayDel({ id: data.id }).done(function (resp) {
          layer.close(index);
          layer.close(deleteLayer);
          // $(obj.tr).remove();
          demoTable.reload(); //重新加载表格
          layer.msg('删除成功！', { icon: 1, time: 2000, shade: 0.2, shadeClose: true });
        }).fail(function (resp) {
          layer.close(index);
          layer.close(deleteLayer);
          layer.msg(resp.responseJSON.message, { icon: 5, anim: 6, time: 3000, shade: 0.1, shadeClose: true });;
        });
      },
        function (deleteLayer) {
          layer.close(deleteLayer);
        });
    } else if (obj.event == 'demo_table_edit') {
     /*
     进行一些修改操作，比如跳转到修改页面，或者弹窗出修改窗口
	*/
    }
  });

//双击行事件
    layui.table.on('rowDouble(demo_table_filter)', function(obj) {
    	//双击行一般是进入详情页面
    	//例：通过该行的id，进行带参数页面跳转 
        let id = obj.data.id;
        location.href = "#/main/second?id=" + id;
    });