1.基礎(chǔ)用法
<el-tree :data="data" :props="treeProps"></el-tree> //樹形控件的屬性綁定對(duì)象
treeProps: {
children: 'children',
label: 'authName',
},通過:data綁定了數(shù)據(jù)源，通過:props綁定了屬性綁定對(duì)象，其中l(wèi)abel代表著我們看到的是哪個(gè)屬性對(duì)應(yīng)的值，children代表父子節(jié)點(diǎn)通過哪個(gè)屬性實(shí)現(xiàn)嵌套的
2.為樹形控件添加show-checkbox屬性，可實(shí)現(xiàn)復(fù)選框效果。如果要求選中的是文本對(duì)應(yīng)的id值，而不是文本值本身。可以使用node-key屬性。
node-key——每個(gè)樹節(jié)點(diǎn)用來作為唯一標(biāo)識(shí)的屬性，整棵樹應(yīng)該是唯一的
default-expand-all——是否默認(rèn)展開所有節(jié)點(diǎn)（默認(rèn)false,true為展開）
<el-tree :data="rightsList" :props="treeProps" show-checkbox node-key="id"
default-expand-all></el-tree>3.
default-expanded-keys——默認(rèn)展開的節(jié)點(diǎn)的 key 的數(shù)組
4.
getCheckedKeys——若節(jié)點(diǎn)可被選擇（即?show-checkbox?為?true），則返回目前被選中的節(jié)點(diǎn)的 key 所組成的數(shù)組
getHalfCheckedKey——若節(jié)點(diǎn)可被選擇（即?show-checkbox?為?true），則返回目前半選中的節(jié)點(diǎn)的 key 所組成的數(shù)組文章來源：http://www.zghlxwxcb.cn/news/detail-537840.html
實(shí)例（獲得當(dāng)前樹形控件被選中以及半選中的Key,并將Key數(shù)組轉(zhuǎn)化為以‘，’分隔的字符串）文章來源地址http://www.zghlxwxcb.cn/news/detail-537840.html
allotRights() {
const keyArr = [
...this.$refs.treeRef.getCheckedKeys(),
...this.$refs.treeRef.getHalfCheckedKeys(),
];
//轉(zhuǎn)換成以，分隔的字符串
const keyStr= keyArr.join(',');
console.log(keyStr)
},到了這里，關(guān)于element-ui樹形控件（tree）的文章就介紹完了。如果您還想了解更多內(nèi)容，請(qǐng)?jiān)谟疑辖撬阉鱐OY模板網(wǎng)以前的文章或繼續(xù)瀏覽下面的相關(guān)文章，希望大家以后多多支持TOY模板網(wǎng)！
