vue管理平台的动态路由

 1 /**
 2  * 后台查询的菜单数据拼装成路由格式的数据
 3  * @param route [] 7  * @param {arr} clientAsyncRoutes 前端保存动态路由
 8  * @param {arr} serverRouter 后端保存动态路由
 9  */
10 function generaMenu(route, serverRouter, clientAsyncRoutes) {
11   state.menu = {}
12   serverRouter.map((ele, index) => {
13     for (let i = 0; i < clientAsyncRoutes.length; i++) {
14       if (clientAsyncRoutes[i].name === serverRouter[index].name) {
15         state.menu = {
16           path: clientAsyncRoutes[i].path,
17           component: clientAsyncRoutes[i].component,
18           // hidden: true,
19           name: clientAsyncRoutes[i].name + ‘_‘ + serverRouter[index].id,
20           meta: serverRouter[index].name === ‘Home‘ ? ‘‘ : { title: clientAsyncRoutes[i].meta.title, icon: clientAsyncRoutes[i].meta.icon }, 
21           children: serverRouter[index].name === ‘Home‘ ? clientAsyncRoutes[i].children : []
22         }
23         route.push(state.menu)
24         if (serverRouter[index].subData.length > 0) {
25           generaMenu(state.menu.children, serverRouter[index].subData, clientAsyncRoutes[i].children)
26         }
27       }
28     }
29   })
30 }

 1 import Layout from ‘@/layout‘
 2 
 3 const eventOperationRouter = {
 4   path: ‘/eventOperation‘,
 5   component: Layout,
 6   redirect: ‘/eventOperation/banner/index‘,
 7   name: ‘eventOperation‘,
 8   meta: {
 9     title: ‘Event Operation‘,
10     icon: ‘iconfont icon-icon-event‘
11   },
12   children: [
13     {
14       path: ‘banner‘,
15       component: () => import(‘@/views/eventOperation/banner/index‘), // Parent router-view
16       name: ‘Banner‘,
17       meta: {
18         title: ‘Banner‘
19       }
20     },
21     {
22       path: ‘‘
23     }
24   ]
25 }
26 export default eventOperationRouter