<template>
  <div class="child-item">

    <el-submenu :index="children.path">

      <template slot="title">
        <div class="menu-item-title">
          <img :src="require(`@/${children.meta.icon}`)" alt="" v-if="children.meta.icon">
          <span>{{children.meta.title}}</span>
        </div>
      </template>

      <template v-for="(child, index) in children.children">

        <template v-if="child.meta.inSideBar && child.children && child.meta.menuType === 'M'">
          <child-item :children="child" :key="child.path"></child-item>
        </template>

        <el-menu-item v-else-if="child.meta.inSideBar && !child.children && child.meta.menuType === 'C'" :key="child.path" :index="child.path">
          <template slot="title">
            <div class="menu-item-title">
              <img :src="require(`@/${child.meta.icon}`)" alt="" v-if="child.meta.icon">
              <span>{{child.meta.title}}</span>
            </div>
          </template>
        </el-menu-item>

      </template>

    </el-submenu>

  </div>
</template>
<script>
export default {
  name: "childItem",
  props: {
    children: {
      type: Object,
    }
  },
  data() {
    return {

    };
  },
  //可访问data属性
  created() {

  },
  //计算集
  computed: {

  },
  //方法集
  methods: {

  },
}
</script>
<style lang="scss" scoped>
</style>
