vue无限极菜单调用自身 报如下错 解决方案?

Cannot access 'MenuTree' before initialization at MenuTree.vue

<template>
  <div>
    <label v-for="menu in data" :key="menu.name">
      <el-submenu :index="menu.name" v-if="menu.children">
        <span>{{menu.meta.title}}</span>
        <label>
          <MenuTree :data="menu.children"></MenuTree>
        </label>
      </el-submenu>
      <el-menu-item v-else :index="menu.name">
        <span slot="title">{{menu.name}}</span>
      </el-menu-item>
    </label>
  </div>
</template>
<script>
import MenuTree from "./MenuTree";
export default {
  name: "MenuTree",
  data() {
    return {
    };
  },
  components: {
    MenuTree: MenuTree
  },
  props: ["data"],
};
</script>