在el-tree中添加两个方法
@node-expand="handleNodeExpand" // 展开节点时触发
@node-collapse="handleNodeCollapse" // 关闭节点时触发
// 树节点展开
handleNodeExpand(data) {
// 保存当前展开的节点
let flag = false
this.defaultExpandIds.some(item => {
if (item === data.id) { // 判断当前节点是否存在, 存在不做处理
flag = true
return
}
})
if (!flag) { // 不存在则存到数组里
this.defaultExpandIds.push(data.id)
}
},
// 树节点关闭
handleNodeCollapse(data) {
// 删除当前关闭的节点
this.defaultExpandIds.some((item, i) => {
if (item === data.id) {
this.defaultExpandIds.splice(i, 1)
}
})
// 这里主要针对多级树状结构,当关闭父节点时,递归删除父节点下的所有子节点
this.removeChildrenIds(data)
},
// 删除树子节点
removeChildrenIds(data) {
const ts = this
//懒加载的时候想要删除子节点 得在加载下级数据时添加上data.children
if (data.children) {
data.children.forEach(function(item) {
const index = ts.defaultExpandIds.indexOf(item.id)
if (index != -1) {
ts.defaultExpandIds.splice(index, 1)
}
ts.removeChildrenIds(item)
})
}
},