用代码的形式展示出来通过定义data，data里面创建数据，通过layui表格clos的形式将数据渲染出来，创建一个带索引的新增按钮塞到表格倒数第一行

好的，以下是代码的展示：

HTML代码：

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

<script type="text/html" id="toolbarDemo">
    <div class="layui-btn-container">
        <button class="layui-btn layui-btn-sm" lay-event="add">新增</button>
    </div>
</script>

JavaScript代码：

//定义数据
var data = [
  {
    "id": 1,
    "name": "张三",
    "age": 20,
    "sex": "男"
  },
  {
    "id": 2,
    "name": "李四",
    "age": 22,
    "sex": "女"
  },
  {
    "id": 3,
    "name": "王五",
    "age": 25,
    "sex": "男"
  }
];

//通过layui表格的形式将数据渲染出来
layui.use('table', function(){
  var table = layui.table;
  
  table.render({
    elem: '#demo',
    toolbar: '#toolbarDemo',
    cols: [[
      {type:'numbers'},
      {field:'id', width:80, title: 'ID'},
      {field:'name', width:100, title: '姓名'},
      {field:'age', width:80, title: '年龄'},
      {field:'sex', width:80, title: '性别'},
      {fixed: 'right', title:'操作', toolbar: '#barDemo', width:150}
    ]],
    data: data
  });
  
  //监听工具条
  table.on('toolbar(test)', function(obj){
    var layEvent = obj.event;
    if(layEvent === 'add'){
      //新增按钮被点击
      var index = data.length + 1;
      //创建一个带索引的新增按钮塞到表格倒数第一行
      data.push({
        id: index,
        name: '',
        age: '',
        sex: ''
      });
      table.reload('demo',{data:data});
    }
  });
});

以上就是答案了，希望能够帮到您！