fix:调整菜单

src/components/layout/index.vue

@@ -3,39 +3,39 @@
         <el-header>
             <el-menu :default-active="activeIndex2" class="el-menu-demo" mode="horizontal" @select="handleSelect"
                 background-color="#545c64" text-color="#fff" active-text-color="#ffd04b">
-                <template>
-                 <el-menu-item index="1"><i class="el-icon-s-pie"></i>主页</el-menu-item>
+                <template v-for="(menu, i) in menuList" >
+                    <el-submenu v-if="menu.children"  index="2" :key="`submenu-${i}`">
+                        <template slot="title">{{ menu.meta.title }}</template>
+                        <el-menu-item v-for="(menu2, m) in menu.children" :key="`menu-${i}-${m}`"  :index="`menu-${i}-${m}`">{{ menu2.meta.title }}</el-menu-item>
+                    </el-submenu>
+                    <el-menu-item v-else :key="`menu-${i}`" :index="`menu-${i}`"><i :class="menu.meta.icon"></i>{{ menu.meta.title }}</el-menu-item>
                 </template>
-                <el-submenu index="2">
-                    <template slot="title">我的工作台</template>
-                    <el-menu-item index="2-1">选项1</el-menu-item>
-                    <el-menu-item index="2-2">选项2</el-menu-item>
-                    <el-menu-item index="2-3">选项3</el-menu-item>
-                </el-submenu>
+
                 <el-menu-item index="3" disabled>消息中心</el-menu-item>
-                <el-menu-item index="4"><a href="https://www.ele.me" target="_blank">订单管理</a></el-menu-item>
+                <el-menu-item index="4"><a href="https://inscode.csdn.net/@tinyu5/VueJS" target="_blank">InsCode</a></el-menu-item>
             </el-menu>
         </el-header>
         <el-main>
-            <DynamicRoute/>
+            <DynamicRoute />
         </el-main>
     </el-container>
 </template>
 <script>
 import DynamicRoute from './dynamicRoute.vue';
 import routes from '@/router/routes'
-function  converRouteData(arr){
-        
-};
+import Utils from '@/utils/index.js'
 export default {
     name: 'layout',
-    components:{DynamicRoute},
+    components: { DynamicRoute },
     data() {
         return {
-            menuList:[]
+            menuList: [],
+            activeIndex2: ''
         }
     },
-   
+    created() {
+        this.menuList = Utils.coventRouteData(routes, item => item);
+    },
     methods: {
         handleSelect(key, keyPath) {
             console.log(key, keyPath);
@@ -44,7 +44,8 @@ export default {
 }
 </script>
 <style scoped>
-.el-header, el-main{
-    padding:0;
+.el-header,
+el-main {
+    padding: 0;
 }
 </style>
\ No newline at end of file

src/utils/index.js

+// directory 是要搜索的目录 ,  useSubdirectories 表示是否搜索子目录, regExp 是匹配文件的正则表达式
+const context = require.context('./modules', false, /.js$/)
+// 讲所有模块导出内容添加到_obj中
+const _obj = context.keys().reduce((pre, key) => {
+    const name = key.replace(/.\/|.js/g,'')
+    const module=context(key);
+    Object.entries(module).forEach(([attr,value])=> {
+        pre[attr] = value;
+    })
+    return pre;
+},{}) 
+
+export default _obj
\ No newline at end of file

src/utils/modules/routeUtils.js

+/**
+ * 
+ * @param {Array} list          路由数据
+ * @param {Function} processFn  处理函数
+ * @returns {Array}             数组数据
+ */
+export function coventRouteData(list, processFn) {
+    return list.map(item => {
+        let { children, component, ...rest } = item;
+        if (children && Array.isArray(children)) {
+            children = coventRouteData(children, processFn)
+            return processFn({ children, ...rest })
+        }
+        return processFn(rest)
+    });
+}