layui 树类型 异步加载

主题思路为:https://www.cnblogs.com/han1982/p/11535627.html
文档介绍。
中间修改是 先选中 上级,点击展开不会把下级选中。 修改思路为:
tree.js 271行

Class.prototype.lazytree = function(elem, children,ischecked){
    var that = this
    ,options = that.config
    ,id = elem.attr('data-id');
    var change = function(data){
      layui.each(data, function(index, e){
        if(e.id===id){
          data[index].children = children;
          return false;
        }
        if(e.children && e.children.length > 0){
          change(e.children);
        }
      });
    }
    //追加数据
    change(options.data);
    that.loading(elem, true);
    var packDiv = $('
'
); elem.append(packDiv); that.tree(packDiv, children); //复选框渲染 if(options.showCheckbox){ that.renderForm('checkbox'); }; var arr = [] for(var i in children){ arr.push(children[i].id) } if(ischecked>-1){ that.setChecked(arr) } }

tree.js 903行

  //懒加载增加节点
  tree.lazytree = function(id, elem, children,ischecked){
    var that = thisModule.that[id];
    return that.lazytree(elem, children,ischecked);
  };

html js:spread方法里面为:

var ischecked = obj.elem[0].childNodes[0].childNodes[0].childNodes[2].className.indexOf('checked')
tree.lazytree(inst1.config.id, obj.elem, arr1,ischecked);

效果
layui 树类型 异步加载_第1张图片
layui 树类型 异步加载_第2张图片

你可能感兴趣的:(js,layui)