Layui 如何表格中新增空行？

在 Layui 的表格中，可以通过以下步骤来新增空行：

1. 首先，在表格的操作栏中添加一个“新增”按钮。

<button class="layui-btn layui-btn-sm" lay-event="add">新增</button>

2. 在 JavaScript 中监听“新增”按钮的点击事件，弹出一个表单。

table.on('toolbar(test)', function(obj) {
  if (obj.event === 'add') {
    layer.open({
      type: 1,
      title: '新增数据',
      content: $('#form-add'),
      area: ['500px', '300px'],
      btn: ['保存', '取消'],
      yes: function(index, layero) {
        // 在这里处理保存逻辑
        layer.close(index);
      },
      btn2: function(index, layero) {
        // 在这里处理取消逻辑
        layer.close(index);
      }
    });
  }
});

3. 在表单中添加需要填写的字段。这里以一个简单的例子为例，只需要填写一个“姓名”字段。

<form id="form-add" class="layui-form">
  <div class="layui-form-item">
    <label class="layui-form-label">姓名</label>
    <div class="layui-input-block">
      <input type="text" name="name" lay-verify="required" placeholder="请输入姓名" autocomplete="off" class="layui-input">
    </div>
  </div>
</form>

4. 在保存逻辑中，获取表单中填写的数据，并向表格中插入一行空数据。

table.on('toolbar(test)', function(obj) {
  if (obj.event === 'add') {
    layer.open({
      type: 1,
      title: '新增数据',
      content: $('#form-add'),
      area: ['500px', '300px'],
      btn: ['保存', '取消'],
      yes: function(index, layero) {
        // 获取表单中填写的数据
        var name = $('input[name="name"]').val();

        // 在表格中插入一行空数据
        table.insert({
          name: name
        });

        layer.close(index);
      },
      btn2: function(index, layero) {
        layer.close(index);
      }
    });
  }
});

这样就可以在 Layui 的表格中新增一行空数据了。