首页layui treegrid 合并单元格

layui treegrid 合并单元格

时间: 2023-09-10 08:13:52 浏览: 102

您可以使用 layui treegrid 的自定义模板来实现合并单元格的效果。下面是一个示例代码： ```html <!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>Layui TreeGrid</title> <link rel="stylesheet" href="https://cdn.staticfile.org/layui/2.5.4/css/layui.css"> </head> <body> <table class="layui-table" id="treeTable"></table> <script src="https://cdn.staticfile.org/layui/2.5.4/layui.js"></script> <script> // 模拟数据 var data = [ {id: 1, name: '节点1', children: [ {id: 2, name: '节点2', children: [ {id: 3, name: '节点3'}, {id: 4, name: '节点4'} ]}, {id: 5, name: '节点5'} ]}, {id: 6, name: '节点6', children: [ {id: 7, name: '节点7'}, {id: 8, name: '节点8'} ]} ]; layui.use(['tree', 'table'], function(){ var tree = layui.tree; var table = layui.table; // 渲染树形表格 tree.render({ elem: '#treeTable', data: data, showLine: true, cols: [[ {field: 'name', title: '名称'}, {field: 'id', title: 'ID'} ]], // 自定义模板方法 templet: function(d){ if(d.children){ return '<span style="font-weight: bold;">'+ d.name +'</span>'; } else { return d.name; } }, // 合并单元格方法 done: function(res, curr, count){ var trs = document.querySelectorAll('#treeTable tr'); for(var i=1; i<trs.length; i++){ var td = trs[i].querySelectorAll('td')[0];＊＊＊

阅读全文