blackteay/Vue3-Vite-Vant-TS-H5
1
0
Fork 0
mirror of https://github.com/talktao/Vue3-Vite-Vant-TS-H5.git synced 2025-04-06 03:57:55 +08:00
Code Issues Packages Projects Releases Wiki Activity

fix：增加自动化路由注释及清理console.log

Browse Source
This commit is contained in:
talktao 2022-03-24 22:14:19 +08:00
parent d17b14b0bc
commit 321109bbcf
1 changed files with 22 additions and 74 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

96
src/router/index.ts
View File

@ -1,20 +1,17 @@
import { createRouter, createWebHashHistory, RouteRecordRaw } from "vue-router"; import { createRouter, createWebHashHistory, RouteRecordRaw } from "vue-router";
// 通过Vite的import.meta.glob()方法实现自动化导入路由
const mainRouterModules = import.meta.glob('../layout/*.vue') const mainRouterModules = import.meta.glob('../layout/*.vue')
console.log(mainRouterModules,'mainRouterModules');
const viewRouterModules = import.meta.glob('../views/**/*.vue') const viewRouterModules = import.meta.glob('../views/**/*.vue')
console.log(viewRouterModules,'viewRouterModules');
// 子路由 // 子路由
const childRoutes = Object.keys(viewRouterModules).map((path)=>{ const childRoutes = Object.keys(viewRouterModules).map((path)=>{
const childName = path.match(/\.\.\/views\/(.*)\.vue$/)[1].split('/')[1]; const childName = path.match(/\.\.\/views\/(.*)\.vue$/)[1].split('/')[1];
return { return {
path: `/${childName.toLowerCase()}`, path: `/${childName.toLowerCase()}`,
name: childName, name: childName,
component: viewRouterModules[path] component: viewRouterModules[path]
} }
}) })
console.log(childRoutes,'childRouter'); console.log(childRoutes,'childRouter');
@ -22,77 +19,21 @@ console.log(childRoutes,'childRouter');
// 根路由 // 根路由
const rootRoutes = Object.keys(mainRouterModules).map((path) => { const rootRoutes = Object.keys(mainRouterModules).map((path) => {
const name = path.match(/\.\.\/layout\/(.*)\.vue$/)[1].toLowerCase(); const name = path.match(/\.\.\/layout\/(.*)\.vue$/)[1].toLowerCase();
console.log(name,'name');
const routePath = `/${name}`; const routePath = `/${name}`;
console.log(routePath,'routePath');
if (routePath === '/index') { if (routePath === '/index') {
return { return {
path: '/', path: '/',
name, name,
redirect: '/home', redirect: '/home',
component: mainRouterModules[path], component: mainRouterModules[path],
children: childRoutes children: childRoutes
}; };
} }
}) })
const routes: Array<RouteRecordRaw> = rootRoutes const routes: Array<RouteRecordRaw> = rootRoutes
// const routes: Array<RouteRecordRaw> = [
// {
// path: '/',
// name: 'Index',
// component: () => import ('@/layout/index.vue'),
// redirect: '/home',
// meta: {
// title: '首页',
// keepAlive:false
// },
// children: [
// {
// path: '/home',
// name: 'Home',
// component: () => import('@/views/home/Home.vue')
// },
// {
// path: '/category',
// name: 'Category',
// component: () => import('@/views/category/Category.vue')
// },
// {
// path: '/welfare',
// name: 'Welfare',
// component: () => import('@/views/welfare/Welfare.vue')
// },
// {
// path: '/orders',
// name: 'Orders',
// component: () => import('@/views/orders/Orders.vue')
// },
// {
// path: '/about',
// name: 'About',
// component: () => import('@/views/about/About.vue')
// },
// {
// path: '/orders',
// name: 'Orders',
// component: () => import('@/views/order/Orders.vue')
// },
// {
// path: '/detail/:id',
// name: 'Detail',
// component: () => import('@/views/home/Detail.vue')
// }
// ]
// },
// ]
console.log(routes,'routes');
const router = createRouter({ const router = createRouter({
history: createWebHashHistory(), history: createWebHashHistory(),
@ -100,3 +41,10 @@ const router = createRouter({
}); });
export default router export default router