树形结构,需求是这样的。服务器一次返回同级的节点,要求增删改查不刷新树形结构。删改查都还好,关键是这个增有个小坑。后台给你返回leaf字段判断这个节点有没有子节点,但是elementui中当设置了树形节点isLeaf为true的时候他的append方法添加子节点是无效的。下面是一个leaf为true的节点属性。
问题的关键就是在这两个属性上面。当用户添加的时候将isLeaf和isLeafByUser设置为false。
写出来后发现很简单
<template>
<div>
<el-tree
ref="tree"
:props="props1"
lazy
:load="loadNode1"
:highlight-current='true'
@node-click="handleNodeClick"
>
</el-tree>
<el-button @click="addNode">添加子节点</el-button>
</div>
</template>
<script>
export default {
name: 'HelloWorld',
data() {
return {
props1: {
label: 'label',
children: 'children',
isLeaf:'leaf&