<template>
  <div>
    <template v-for="item in this.menuList">
      <el-submenu :disabled="item.disabled" :index="item.id+''" :key="item.id">
<!--        一级目录-->
        <template slot="title">
          <i :class="item.icon"></i>
          <span slot="title">{{ item.menuName }}</span>
        </template>
<!--        子元素-->
<!--        自己调用自己,传了一个menuList-->
        <MenuTree :menu-list="item.children"></MenuTree>
      </el-submenu>
    </template>
  </div>
</template>

<script>
export default {
  name: 'MenuTree',
  props: ['menuList']
}
</script>

<style scoped>

</style>

Q.E.D.