layui基础上的tree菜单动态渲染;

 1 var layout=[
 2     {
 3         title:'脚本对象名称',
 4         treeNodes:true,
 5         headerClass:'value_col',
 6         colClass:'value_col',
 7         style:'60%'
 8     },
 9     {
10         title:'操作',
11         headerClass:'value_col',
12         colClass:'value_col',
13         style:'9%',
14         render:function(row){
15             var str='';
16             if(row.parentId!=null&&row.children.length<=0){//有父元素没有子元素;
17                 str = '<a class="layui-btn layui-btn-danger layui-btn-xs" onclick=del("' + row.id + '","' + row.parentId + '","' + row.children.length + '")><i class="layui-icon">&#xe640;</i></a>'
18             }else{
19                 ''
20             }
21             return '<a class="layui-btn layui-btn-normal layui-btn-xs" onclick=add("'+row.id+'","'+row.level+'")><i class="layui-icon">&#xe654;</i></a>'+
22                 '<a class="layui-btn layui-btn-warm layui-btn-xs" onclick=change("' + row.id + '","' + row.title + '")><i class="layui-icon">&#xe642;</i></a>'+ //列渲染
23                 str;
24         }
25     }
26 ];
27 var groupList;
28 layui.use(['tree', 'layer','form','table'], function() {
29     var $ = layui.$,
30         layer = layui.layer,
31         form = layui.form,
32         table = layui.table;
33         $.ajax({
34             type: "post",
35             url: "/cd/tool/scene/tree.afca",
36             dataType:'json',
37             success:function(data){
38                 if(data.code==='0'){
39                     var message=data.msg;
40                     groupList=data.data;
41                     layui.treeGird({
42                         elem:'#demo',
43                         spreadable:true,
44                         nodes:groupList,
45                         layout:layout
46                     })
47                 }
48             },
49             error:function(){
50 
51             }
52         })
53 
54 });

原文地址:https://www.cnblogs.com/yangguoe/p/9024839.html