1级联 2树tree 3选项卡 4面包屑

1.级联

1.1基本用法:

 :options="options"
    @change="handleChange">

 1.2 返回的字段与默认的字段不一致　　

defaultProps：{
children:"children"，
label："depNames"
}

 1.3  不能用click点开

        禁用数据disabled:true

        show-all-levels="flase"那么只显示一级

        多选：props:{mutiple:true;}

2.树型控件el-tree

 2.1 基本属性

accordion是风琴式；  

设置props的disabled，

:props={label:'label2',children:"ch2",disabled:"dis2",isLeaf:"isleaf2"}　　

el-tree的基本用法：

:props="defaultProps"
@node-click="handleNodeClick">

2.2 点击时加载

  @current-change="changeFolder"
  show-checkbox
  accordion
  ref=""
  node-key=""
  highlight-current
  >

　2.3 动态加载

   lazy：是否懒加载子节点，需与 load 方法结合使用 | load: function(node, resolve)   

  设置默认展开:default-expanded-keys="[2,3]"  ;   

默认选中:default-checked-keys="[5]" ;使用这二个属性需要设置node-key=""

加载方法

获取所有被选中的keys:this.$refs.tree.getCheckedKeys（）  |  getCheckedNodes（）

清空，setCheckedNodes([])

获取最后一级：let tree=this.$refs.tree.getCheckedKeys(true);

resolve([]) 有内容的话，是返回的内容。其中node.data是当前的内容。

可提前告知tree某个节点是否为叶子节点：leaf:true有节点

  loadNode(node, resolve) {
        if (node.level === 0) {
          return resolve([{ name: 'region' }]);
        }
        if (node.level > 1) return resolve([]);
}

3.选项卡　

activeName="nameSelect",nameSelect是子元素的name的值

  
    用户管理
  

tabClick方法

tabClick（tab，event）{

}

动态增加和删除卡片

参考：https://element.eleme.cn/#/zh-CN/component/tabs

4.面包屑

separator-class可使用相应的iconfont

  首页