table表格中使用layui-form

若你想在layui中使用表格，需要先引入layui框架，并且加载layui.form模块。在HTML中，你需要构建一个table元素，并为其添加lay-filter属性，用于layui识别。接着，你需要在JavaScript代码中使用layui.table.render()方法来渲染表格，同时需要将lay-filter属性与表格ID传入。

示例代码如下：

HTML:

<table class="layui-hide" id="demo" lay-filter="test"></table>

JavaScript:

layui.use(['table', 'form'], function(){
  var table = layui.table;
  var form = layui.form;

  //渲染表格
  table.render({
    elem: '#demo',
    url: '/api/table',
    toolbar: '#toolbarDemo',
    page: true,
    cols: [[
      {type: 'checkbox'},
      {field: 'id', title: 'ID', width: 80},
      {field: 'username', title: '用户名', width: 120},
      {field: 'email', title: '邮箱', minWidth: 150},
      {field: 'sex', title: '性别', width: 80, sort: true},
      {field: 'city', title: '城市', width: 100},
      {field: 'sign', title: '签名', minWidth: 120},
      {field: 'experience', title: '积分', width: 80, sort: true},
      {field: 'score', title: '评分', width: 80, sort: true},
      {field: 'classify', title: '职业', width: 100},
      {field: 'wealth', title: '财富', sort: true},
      {fixed: 'right', title:'操作', toolbar: '#barDemo', width:150}
    ]]
  });

  //监听工具条
  table.on('tool(test)', function(obj){
    var data = obj.data;
    if(obj.event === 'detail'){
      layer.msg('ID：'+ data.id + ' 的查看操作');
    } else if(obj.event === 'del'){
      layer.confirm('真的删除行么', function(index){
        obj.del();
        layer.close(index);
      });
    } else if(obj.event === 'edit'){
      layer.alert('编辑行：<br>'+ JSON.stringify(data))
    }
  });

  //监听复选框
  table.on('checkbox(test)', function(obj){
    console.log(obj)
  });

  //监听单元格编辑
  table.on('edit(test)', function(obj){
    console.log(obj)
  });

  //监听排序
  table.on('sort(test)', function(obj){
    console.log(obj)
  });
});

上述代码中，我们使用了layui.form模块来监听表格的复选框、单元格编辑和排序功能。同时，在HTML中也定义了一个toolbar，用于添加表格中的操作按钮。