SOURCE

let tableId = "listTable"
let dict = [
    {value: 0,label: "下拉框0"},
    {value: 1,label: "下拉框1"},
    {value: 2,label: "下拉框2"},
    {value: 3,label: "下拉框3"},
]
let maxRows = 20
let data = []
for(let i=0; i< maxRows; i++) {
    data.push( {
        input_val: "文本框"+1, checkbox_val: 0, select_val: i, color_val: "#fff",
        overflowText: '测试超出宽度显示效果测试超出宽度显示效果'
    })
}



let cols = [[
    { type: 'numbers', fixed: 'center' },
    { field: 'input_val', title: '文本框' },
    { field: 'checkbox_val', title: '复选框',dict },
    { field: 'select_val', title: '下拉框'},
    { field: 'overflowText', title: '超长文本'},
    { field: 'overflowText', title: '颜色框', editConfig: { form: "color" }  },
    {
        field: 'LAY_CELL_TOOLBAR',
        title: '操作',
        align: 'center',
        templet: "#cell-tool-bar-tpl"
    },
]]

table.render({
    id: tableId ,
    elem: '#' + tableId ,
    height: 'full-130',
    data,
    cols,
    // 内容超出tips显示控制
    overflow: {type: "tips",
                    minWidth: 100,
                    maxWidth: 300,
                    color: "white",
                    bgColor: "black"},

    // 开启默认工具栏，此处主要测试显示扩展工具栏，可以自定义模板，详见文档
    toolbar: 'default',
    extToolbar: ["excel","csv"],
    excel: {templateUrl: "aaaaa", exportUrl: "" , importUrl: "",params: {},beforeHandler(obj){} }

});


$("#operation-buttons .layui-btn").on('click', function () {
    let layevent = this.getAttribute("lay-event");
    if (layevent == 'add-new-line') {
        table.addRow(tableId, 0,  {
            input_val: "文本框1", checkbox_val: 0, select_val: "0", color_val: "#fff"}
        )
    } else if (layevent == 'del-first-line') {
        table.deleteRow(tableId, 0)
    } else if (layevent == 'get-ins-config') {
        let config = table.getInstance(tableId).config
        layer.msg(JSON.stringify(config))
    }else if (layevent == 'render-first-row') {
        let data = table.getRows(tableId)[0]
        let rdata = {
            checkbox_val: Math.round(Math.random() * 3 + 1),
        }
        console.log(data.id,isBlank(data.id))
        if(isBlank(data.id)){
            rdata.id = "1111"
        }else{
            rdata.id = ""
        }
        
        // 要渲染的列 必须有 field的属性
        table.renderSpecRow(tableId , 0 , rdata)
    }

    
});

//监听列单击事件
table.on(`cell(${tableId})`, function (obj) {
    layer.success(`当前行：${obj.rowIndex}，当前列：${obj.colIndex}，当前行数据：${JSON.stringify(obj.data)}`)
});

<div class="layui-card">
    <div class="layui-card-header">基础方法</div>
    <div class="layui-card-body">
         <div id="operation-buttons">
            <button class="layui-btn layui-btn-sm layui-btn-normal " lay-event="add-new-line">
                新增一行
            </button>
           <button class="layui-btn layui-btn-sm layui-btn-normal " lay-event="del-first-line">
                删除首行
            </button>
             <button class="layui-btn layui-btn-sm layui-btn-normal " lay-event="get-ins-config">
                表格实例配置
            </button>
              <button class="layui-btn layui-btn-sm layui-btn-normal " lay-event="render-first-row">
                渲染第一行
            </button>
        </div>
        <table id="listTable" lay-filter="listTable" class="row-editable-table" ></table>
    </div>
</div>

<script  type="text/html" id="cell-tool-bar-tpl">
     {{#  if(isBlank(d.id)){ }}
    <a class="layui-btn layui-btn-xs layui-btn-normal" lay-event="newEdit" title="保存"><i
            class="layui-icon layui-icon-ok"></i></a>
    <a class="layui-btn layui-btn-xs layui-btn-normal" lay-event="newDel" title="删除"><i
            class="layui-icon layui-icon-close"></i></a>
    {{#  } else { }}
    <a class="layui-btn layui-btn-xs layui-btn-normal" lay-event="edit" title="保存"><i
            class="layui-icon layui-icon-release"></i></a>
    <a class="layui-btn layui-btn-xs layui-btn-danger" lay-event="del" title="删除"><i
            class="layui-icon layui-icon-close-fill"></i></a>
    {{#  } }}
</script>