• 使用的是element-ui的组件el-tree

<template>
  <div class="page-header-index-wide">
    <a-card :bordered="false">
      <a-button type="primary" icon="plus" @click="$refs.edit.showAdd()">添加部门信息</a-button>
      <el-tree
        class="el-tree-margin"
        highlight-current
        node-key="id"
        default-expand-all
        :expand-on-click-node="false"
        :data="treeData"
        @node-click="handleAdd">
        <span class="custom-tree-node" slot-scope="{ node, data }">
          <span>{{ data.lable }}</span>
          <span>
            <a
              type="text"
              size="mini"
              @click="() => editDepartment(data)">
              修改
            </a>
          </span>
        </span>
      </el-tree>
      <edit ref="edit" @success="initTreeData"></edit><!--这个@success很重要->
    </a-card>
  </div>
</template>

• 当编辑部门（增加部门同理）的时候，点击修改会触发editDepartment（）方法，这个方法是调出一个部门的编辑界面。

editDepartment (data) {
      getDepartmentById(data.id).then(res => {
        this.$refs.edit.showEdit(res.data.data[0])
      })
    }

• 当修改成功之后要触发一个success事件

updateDepartment(req).then(res => {
               if (res.httpStatus === 200) {
                  this.$message.success('修改部门信息成功！')
                  this.visible = false
                  this.curItem = {}
                  this.$emit('success', true)//就是这一行，至关重要！！！
               }
            })

• 这个sueecss事件会让el-tree下面的edit中的@success事件，从而调用initTreeData方法

initTreeData () {
      //设置新的treeData的值
    },

大功告成！！！