分类

链接

2023 年 3 月
 12345
6789101112
13141516171819
20212223242526
2728293031  

近期文章

热门标签

新人福利,免费薅羊毛

现在位置:    首页 > 前端 > 正文
共享办公室出租
vue3+vite3实现路由自动化
前端 暂无评论 阅读(248)

 

import {createRouter, createWebHashHistory} from 'vue-router'

const modules = import.meta.glob('/src/pages/**/index.js');
console.log(modules);
const routes = [];

let components = [];

Object.keys(modules).forEach(key => {

    let component = modules[key];
    components.push(component());

    let name = key.split('pages/')[1].split('/')[0].toLowerCase();

    let path = "/" + name;
    if (name === 'index') {
        path = "/";
    }
    let title = name;

    routes.push({path, name, meta: {title: title}, component});

});

//get title from page
let res = await Promise.all(components);
res.forEach(page => {
    for (const route of routes) {
        if (route.name === page.default.name.toLowerCase() && page.default.title) {
            route.meta.title = page.default.title;
            break;
        }
    }
});

console.log(routes);

/**
 * 定义返回模块
 */
const router = createRouter({
    history: createWebHashHistory(), routes
})

export default router;

 

============ 欢迎各位老板打赏~ ===========

本文版权归Bruce's Blog所有,转载引用请完整注明以下信息:
本文作者:Bruce
本文地址:vue3+vite3实现路由自动化 | Bruce's Blog

发表评论

留言无头像?