这里不对element ui做过多介绍，直接介绍工作最常用的一个动态加载树形组件的常用用法
引入tree组件的代码如下：
/* 动态加载lazy参数和load方法是必选的, lazy:为节点store（TreeStore）中的属性，可输出当前节点进行查看 load：加载子数据的方法，用法为function(node,reslove){} */
现在对tree的两个常用方法分析
1、node-click：节点被点击时的回调，共三个参数，依次为：传递给 data 属性的数组中该节点所对应的对象、节点对应的 Node、节点组件本身。即function（data,node,vuecomponent）{}
node-clikc方法:function(data,node,vueComponent){ //可以进行常用的点击view层展示切换}
data:参数为我们点击的节点的数据对象
node:(node对象） checked:false//是否选中
childNodes:Array(3)//子节点
data:Object//data数据对象
expanded:true//是否可以展开
id:1//node的id
indeterminate:false//和checkbox结合的属性，选框的样式
isLeaf:false
level:1//点击的node层级
loaded:true//加载完
loading:false//加载中
parent:Node//父级node
store:TreeStore//树形数据的store
text:null
visible:(...)
disabled:(...)
icon:(...)
key:(...)
label:"1"
__ob__:Observer {value: Node, dep: Dep, vmCount: 0} get checked:ƒ reactiveGetter() set checked:ƒ reactiveSetter(newVal) get childNodes:ƒ reactiveGetter() set childNodes:ƒ reactiveSetter(newVal) get data:ƒ reactiveGetter() set data:ƒ reactiveSetter(newVal) get expanded:ƒ reactiveGetter() set expanded:ƒ reactiveSetter(newVal) get id:ƒ reactiveGetter() set id:ƒ reactiveSetter(newVal) get indeterminate:ƒ reactiveGetter() set indeterminate:ƒ reactiveSetter(newVal) get isLeaf:ƒ reactiveGetter() set isLeaf:ƒ reactiveSetter(newVal) get level:ƒ reactiveGetter() set level:ƒ reactiveSetter(newVal) get loaded:ƒ reactiveGetter() set loaded:ƒ reactiveSetter(newVal) get loading:ƒ reactiveGetter() set loading:ƒ reactiveSetter(newVal) get parent:ƒ reactiveGetter() set parent:ƒ reactiveSetter(newVal) get store:ƒ reactiveGetter() set store:ƒ reactiveSetter(newVal) get text:ƒ reactiveGetter() set text:ƒ reactiveSetter(newVal) get visible:ƒ reactiveGetter() set visible:ƒ reactiveSetter(newVal)
__proto__:Object
具体用法//node-click函数handleNodeClick(data,parent,child){ //to do something ,load data from server and show the data to the view
if(data.label == 1){//判断点击节点，进行view层试图切换，choose the node you clicked
/*to do something*/
}
}2、load方法
load:加载子数据的方法，一般形式为function(node,reslove){},运用了promise记得进行promise兼容
loadNode(node, resolve){
console.log(node); if (node.level === 0) { //初始第一层节点,根节点
return resolve([{ 'parent': '1' }, { 'parent': '2' }, {'parent': '3' },]);
} var data = []; if(node.data.parent == 1){ //对点击节点加载内容处理
//一次只能处理一层，sub属性数据被忽略
data = [{'parent':'1-1','sub':[{ 'parent':'1-1-1',
}]},{'parent':'1-2'},{'parent':'1-3'}];
} if(node.data.parent == 2){
data = [{'parent':'2-1'},{'parent':'2-2'},{'parent':'2-3'}];
} //内容更新
resolve(data)
} 
