简易版 树形组件 Elementui组件递归

环境：

node：12、vue：2

目的：

渲染一个有三级菜单的树形组件

效果：

实现方法：

1.判断是否有children，如果有children渲染为el-submenu,否则el-menu-item。

2.如果是el-menu-item则应该绑定上path

<template>
  <div>
    <template v-for="item in treeData">
      <el-submenu
        :index="item._id"  v-if="item.children && item.children.length > 0">
        <template slot="title">
          <span>{{item.menuName}}</span>
        </template>
        <TreeMenu :treeData="item.children"></TreeMenu>
      </el-submenu>
    <el-menu-item v-else :index="item.path"
          :key="item._id"> {{item.menuName}}</el-menu-item>   
    </template>
  </div>
</template>

<script>
export default {
  name: "TreeMenu",
  props:{
    treeData:{
      type:Array,
      default:function(){
        return []
      }
    }
  }
}
</script>

<style scoped>

</style>

源码地址：

git@github.com:Jeem555/123.git