默认路由名字使用symbol,防止命名冲突

This commit is contained in:
Jason 2022-06-23 11:41:08 +08:00
parent eddc1db493
commit e9f9b2c035
4 changed files with 16 additions and 11 deletions

View File

@ -39,6 +39,6 @@ export default defineComponent({
</script> </script>
<style lang="scss"> <style lang="scss">
@import './assets/font/iconfont.css'; @import "./assets/font/iconfont.css";
@import './styles/index.scss'; @import "./styles/index.scss";
</style> </style>

View File

@ -1,5 +1,5 @@
import { RouteRecordRaw, RouterView } from "vue-router" import { RouteRecordRaw, RouterView } from "vue-router"
import Layout from '@/layout/index.vue'
export enum MenuType{ export enum MenuType{
Catalogue = 'M', Catalogue = 'M',
Menu = 'C', Menu = 'C',
@ -12,6 +12,7 @@ const modules = import.meta.glob('/src/views/**/*.vue')
// 过滤路由所需要的数据 // 过滤路由所需要的数据
export function filterAsyncRoutes(routes: any[], firstRoute = true) { export function filterAsyncRoutes(routes: any[], firstRoute = true) {
return routes.map((route => { return routes.map((route => {
const routeRecord = createRouteRecord(route, firstRoute) const routeRecord = createRouteRecord(route, firstRoute)
if (route.children != null && route.children && route.children.length) { if (route.children != null && route.children && route.children.length) {
@ -39,7 +40,7 @@ export function createRouteRecord(route: any, firstRoute: boolean): RouteRecordR
} }
switch (route.menuType) { switch (route.menuType) {
case MenuType.Catalogue: case MenuType.Catalogue:
routeRecord.component = RouterView routeRecord.component = firstRoute ? Layout : RouterView
break break
case MenuType.Menu: case MenuType.Menu:
routeRecord.component = loadRouteView(route.component) routeRecord.component = loadRouteView(route.component)

View File

@ -4,7 +4,7 @@
import NProgress from 'nprogress' import NProgress from 'nprogress'
import store from './store' import store from './store'
import router from './router' import router, { indexName } from './router'
import 'nprogress/nprogress.css' import 'nprogress/nprogress.css'
// NProgress配置 // NProgress配置
@ -27,7 +27,11 @@ router.beforeEach(async (to, from, next) => {
await store.dispatch('user/getUser') await store.dispatch('user/getUser')
const routes = await store.dispatch('permission/generateRoutes') const routes = await store.dispatch('permission/generateRoutes')
routes.forEach((route: any) => { routes.forEach((route: any) => {
router.addRoute('index', route) // 动态添加可访问路由表 if(!route.children) {
router.addRoute(indexName, route)
return
}
router.addRoute(route) // 动态添加可访问路由表
}) })
console.log(router.getRoutes()) console.log(router.getRoutes())
if (to.path === '/login') { if (to.path === '/login') {

View File

@ -1,5 +1,6 @@
import { createRouter, createWebHistory, RouteRecordRaw } from 'vue-router' import { createRouter, createWebHistory, RouteRecordRaw } from 'vue-router'
import Layout from '@/layout/index.vue' import Layout from '@/layout/index.vue'
export const indexName = Symbol('index')
/** /**
* Note: 路由配置项 * Note: 路由配置项
* *
@ -18,12 +19,11 @@ import Layout from '@/layout/index.vue'
// 公共路由 // 公共路由
export const constantRoutes: Array<RouteRecordRaw> = [ export const constantRoutes: Array<RouteRecordRaw> = [
{ {
name: indexName,
path: '/', path: '/',
redirect: 'workbench', redirect: '/workbench',
name: 'index', component: Layout
component: Layout,
}, },
{ {
path: '/permission', path: '/permission',
component: Layout, component: Layout,