VUE Element-ui父组件与子组件相互调用

1. 父组件代码

<template>
    <div>
        <!-- 栏目树状结构 -->
        <el-container>

        <el-aside width="200px">
        <el-tree :data="columnTree" :props="defaultProps" node-key="id" show-checkbox ref="tree" accordion default-expand-all @node-click="handleNodeClick"></el-tree>
        </el-aside>

        <el-main>
        <!-- 搜索条件 -->
        <div>
	  <!-- 引入子组件 -->
	  <!-- ref='edit' 定义子组件名称，用于父组件调用子组件的方法 -->
	  <!-- @reload="getColumnTree" 用于子组件调用父组件的方法 reload是子组件调用函数名，getColumnTree是实际被调用的函数 -->
          <edit ref='edit' @reload="getColumnTree"></edit> 
        </div>
        </el-main>
        </el-container>
        <!-- 博客的展示 -->
    </div>
</template>
<script>
// 引入marked
// import marked from 'marked'

import $edit from '@/components/communal/markdown/columnEdit.vue'

import 'mavon-editor/dist/css/index.css'
export default {
   
  components: {
   
    'edit': $edit // 引入子组件
  },
  created () {
   
    // 获取博客栏目的树状数据
    this.getColumnTree()
  },
  data () {
   
    return {
   
      columnTree: [
      ],
      defaultProps: {
   
        children: 'children',
        label: 'name'
      }