横向:
renderContent(h, { node, data }) {
// data.disabled = true
let className = '' // perms这个是后台数据区分普通tree节点和横向tree节点的标志 各位要根据实际情况做相对应的修改
if (!data.children) {
className = 'especially'
}
return (
// 在需要做横向排列的模块做标记
<div class={className}>{data.label} </div>
)
}, // 改变tree节点样式
changeTreeClass() {
// 找到之前做标记的class
var classDomList = document.getElementsByClassName('especially')
// 改变这几个样式
for (var i = 0; i < classDomList.length; i++) {
classDomList[i].parentNode.style.cssText = 'float: left'
classDomList[i].parentNode.className =
'el-tree-node__content option-wrapper'
classDomList[i].parentNode.parentNode.parentNode.style.marginLeft =
'70px'
};
changeTreeClass需要在渲染树完成后再去进行变化(mounted);
查看:需要递归添加属性disabled,可通过set设置被选中的。
recursion(data) {
data.forEach(item => {
if (!item.children) {
item.disabled = true
} else {
item.disabled = true
return this.recursion(item.children)
}
})
},