Showing
6 changed files
with
72 additions
and
4 deletions
| 1 | import { createRouter, createWebHashHistory } from 'vue-router'; | 1 | import { createRouter, createWebHashHistory } from 'vue-router'; |
| 2 | -import routes from './route.js'; | 2 | +import RootRoute from './route.js'; |
| 3 | import { generateRoute } from './utils/generateRoute' | 3 | import { generateRoute } from './utils/generateRoute' |
| 4 | 4 | ||
| 5 | +// TAG: 路由配置表 | ||
| 6 | +/** | ||
| 7 | + * 把项目独有的路由配置到相应的路径,默认路由文件只放公用部分 | ||
| 8 | + * 但是 vue 文件内容还是要事先准备好 | ||
| 9 | + */ | ||
| 10 | +const modules = import.meta.globEager('@/router/routes/modules/**/*.js'); // Vite 支持使用特殊的 import.meta.glob 函数从文件系统导入多个模块 | ||
| 11 | +const routeModuleList = []; | ||
| 12 | + | ||
| 13 | +Object.keys(modules).forEach((key) => { | ||
| 14 | + const mod = modules[key].default || {}; | ||
| 15 | + const modList = Array.isArray(mod) ? [...mod] : [mod]; | ||
| 16 | + routeModuleList.push(...modList); | ||
| 17 | +}); | ||
| 18 | + | ||
| 5 | // TODO: 微信分享测试 | 19 | // TODO: 微信分享测试 |
| 6 | import share from '@/utils/share' | 20 | import share from '@/utils/share' |
| 7 | 21 | ||
| 8 | // 创建路由实例并传递 `routes` 配置 | 22 | // 创建路由实例并传递 `routes` 配置 |
| 9 | // 你可以在这里输入更多的配置,但我们在这里 | 23 | // 你可以在这里输入更多的配置,但我们在这里 |
| 10 | -// 暂时保持简单 | 24 | + |
| 11 | const router = createRouter({ | 25 | const router = createRouter({ |
| 12 | history: createWebHashHistory('/index.html'), | 26 | history: createWebHashHistory('/index.html'), |
| 13 | - routes | 27 | + routes: [...RootRoute, ...routeModuleList] |
| 14 | }); | 28 | }); |
| 15 | 29 | ||
| 16 | // TAG: 动态生成路由 | 30 | // TAG: 动态生成路由 |
| 31 | +/** | ||
| 32 | + * generateRoute 负责把后台返回数据拼接成项目需要的路由结构,动态添加到路由表里面 | ||
| 33 | + */ | ||
| 17 | router.beforeEach((to) => { // next 不能用了,被return替代了 | 34 | router.beforeEach((to) => { // next 不能用了,被return替代了 |
| 18 | if (!router.hasRoute(to.name)) { // 如果不存在 | 35 | if (!router.hasRoute(to.name)) { // 如果不存在 |
| 19 | router.addRoute(generateRoute(to)) // 新增路由 | 36 | router.addRoute(generateRoute(to)) // 新增路由 | ... | ... |
src/router/index.js
deleted
100644 → 0
File mode changed
src/router/routes/index.js
deleted
100644 → 0
File mode changed
src/router/routes/modules/business/index.js
0 → 100644
src/views/about.vue
0 → 100644
| 1 | +<template> | ||
| 2 | + <div class="">router test</div> | ||
| 3 | +</template> | ||
| 4 | + | ||
| 5 | +<script setup> | ||
| 6 | +import { ref } from 'vue' | ||
| 7 | +import { useRoute, useRouter } from 'vue-router' | ||
| 8 | + | ||
| 9 | +import { Cookies, $, _, axios, storeToRefs, mainStore, Toast } from '@/utils/generatePackage.js' | ||
| 10 | +//import { } from '@/utils/generateModules.js' | ||
| 11 | +//import { } from '@/utils/generateIcons.js' | ||
| 12 | +//import { } from '@/composables' | ||
| 13 | +const $route = useRoute(); | ||
| 14 | +const $router = useRouter(); | ||
| 15 | + | ||
| 16 | +</script> | ||
| 17 | + | ||
| 18 | +<script> | ||
| 19 | +import mixin from 'common/mixin'; | ||
| 20 | + | ||
| 21 | +export default { | ||
| 22 | + mixins: [mixin.init], | ||
| 23 | + data () { | ||
| 24 | + return { | ||
| 25 | + | ||
| 26 | + } | ||
| 27 | + }, | ||
| 28 | + mounted () { | ||
| 29 | + | ||
| 30 | + }, | ||
| 31 | + methods: { | ||
| 32 | + | ||
| 33 | + } | ||
| 34 | +} | ||
| 35 | +</script> | ||
| 36 | + | ||
| 37 | +<style lang="less" scoped> | ||
| 38 | + | ||
| 39 | +</style> |
-
Please register or login to post a comment