diff --git a/examples/tree.html b/examples/tree.html index ed23627..ea5f801 100644 --- a/examples/tree.html +++ b/examples/tree.html @@ -33,6 +33,11 @@ //,target: '_blank' //是否新选项卡打开(比如节点返回href才有效) , drag: true, + props:{ + name: 'name', + id: 'id', + children:'children' + }, change:function(val){ console.group('change event') console.log('Array') @@ -53,7 +58,7 @@ console.log(elem); console.log('dom add event') var item ={ - name: '测试节点', + name: '测试节点'+new Date().getTime(), id:-1 } add(item) diff --git a/src/lay/modules/tree.js b/src/lay/modules/tree.js index 95e8540..12204fd 100644 --- a/src/lay/modules/tree.js +++ b/src/lay/modules/tree.js @@ -11,12 +11,23 @@ layui.define('jquery', function(exports) { var $ = layui.$, hint = layui.hint(); + //勾选集合 + var changeList = []; + //变量别名 + var props ={ + name: 'name', + id: 'id', + children:'children' + }; + var enterSkin = 'layui-tree-enter', Tree = function(options) { this.options = options; + this.props = this.options.props || props; + this.nameKey = this.props.name || props.name; + this.idKey = this.props.id || props.id; + this.childrenKey = this.props.children || props.children; }; - //勾选集合 - var changeList = []; //图标 var icon = { arrow: ['', ''] //箭头 @@ -44,13 +55,13 @@ layui.define('jquery', function(exports) { var nodes = children || options.nodes; layui.each(nodes, function(index, item) { - var hasChild = item.children && item.children.length > 0; + var hasChild = item[that.childrenKey] && item[that.childrenKey].length > 0; var ul = $(''); var li = that.getNode(item, hasChild); //如果有子节点,则递归继续生成树 if(hasChild) { li.append(ul); - that.tree(ul, item.children); + that.tree(ul, item[that.childrenKey]); } //伸展节点 that.spread(li, item); @@ -60,6 +71,7 @@ layui.define('jquery', function(exports) { }); }; +//节点dom拼接 Tree.prototype.getDom = function() { var that = this, options = that.options @@ -82,7 +94,7 @@ layui.define('jquery', function(exports) { return '' + - ('' + (item.name || '未命名') + '') + ('' + (item[that.nameKey] || '未命名') + '') }, menu: function(item) { return '
' + @@ -98,7 +110,7 @@ layui.define('jquery', function(exports) { var that = this, options = that.options var dom = that.getDom(); - var li = $(['
  • ' + var li = $(['
  • ' //展开箭头 , dom.spread(item, hasChild)