初始化项目

src/view/layout/aside/asideComponent/index.vue

@@ -0,0 +1,59 @@
+<template>
+  <component
+    :is="menuComponent"
+    v-if="!routerInfo.hidden"
+    :is-collapse="isCollapse"
+    :theme="theme"
+    :router-info="routerInfo"
+  >
+    <template v-if="routerInfo.children&&routerInfo.children.length">
+      <AsideComponent
+        v-for="item in routerInfo.children"
+        :key="item.name"
+        :is-collapse="false"
+        :router-info="item"
+        :theme="theme"
+      />
+    </template>
+  </component>
+</template>
+
+<script>
+export default {
+  name: 'AsideComponent',
+}
+</script>
+
+<script setup>
+import MenuItem from './menuItem.vue'
+import AsyncSubmenu from './asyncSubmenu.vue'
+import { computed } from 'vue'
+const props = defineProps({
+  routerInfo: {
+    type: Object,
+    default: () => null,
+  },
+  isCollapse: {
+    default: function() {
+      return false
+    },
+    type: Boolean
+  },
+  theme: {
+    default: function() {
+      return {}
+    },
+    type: Object
+  }
+})
+
+const menuComponent = computed(() => {
+  if (props.routerInfo.children && props.routerInfo.children.filter(item => !item.hidden).length) {
+    return AsyncSubmenu
+  } else {
+    return MenuItem
+  }
+})
+
+</script>
+