el-tree添加节点
时间: 2023-10-10 13:15:30 浏览: 86
对于 el-tree 添加节点,你可以使用 el-tree 的 API 中的 append 方法来实现以下是一个示例代码:
```html
<template>
<el-tree :data="treeData" :props="defaultProps" ref="tree"></el-tree>
<el-button @click="addNode">添加节点</el-button>
</template>
<script>
export default {
data() {
return {
treeData: [
{
label: '节点1',
children: [
{
label: '子节点1'
},
{
label: '子节点2'
}
]
}
],
defaultProps: {
children: 'children',
label: 'label'
}
};
},
methods: {
addNode() {
const parent = this.$refs.tree.getNode(this.treeData[0]);
parent.append({ label: '新节点' });
}
}
};
</script>
```
在上面的代码中,我们首先定义了一个 el-tree 组件,其中的 treeData 数组用于存放树的数据。然后,在 addNode 方法中,我们通过 this.$refs.tree.getNode(this.treeData) 获取到根节点,然后调用 parent.append 方法添加新节点。
需要注意的是,这里的示例是基于 Element UI 的 el-tree 组件,所以你需要在项目中引入 Element UI 并正确配置。
希望这个例子对你有所帮助!如果有任何问题,请随时提问。
阅读全文