vue - 项目之路由封装

1、封装的路由代码块(LazyRouter文件)

    const lazyRouter={
        routes:[],
        add(route,name,meta,viewpath){
            this.routes.push({
                path:route,
                name:name,
                meta:meta,
                component:viewpath,
            });
        }
    }
    export default lazyRouter;

2、在vue项目中的router下面的index.js文件中写

import Vue from 'vue'
import Router from 'vue-router'
//	引入文件封装所在的位置
import lazyRouter from '../libs/LazyRouter';

// 页面路由
import Tabshopnewsfrom '../../managerpages/information/tabshopnews'

lazyRouter.add('/tabshopnews','tabshopnews','栏目',Tabshopnewsfrom );

//	将lazyRouter对象下面的routes暴露出去
Vue.use(Router);
export default new Router({
    routes:lazyRouter.routes
})

​​目录文件:
   在这里插入图片描述

发布了44 篇原创文章 · 获赞 8 · 访问量 2万+

猜你喜欢

转载自blog.csdn.net/LiaoFengJi/article/details/95180582