Vue的一级路由和二级路由 Vue的一级路由和二级路由

1、package.json包中

文章图片
2、在main.js中引用

文章图片

文章图片
其次：一级路由的配置
import Vuefrom 'vue';
import Routerfrom 'vue-router';
Vue.use(Router);
export default new Router({
//去除路径中的#标志
mode:"history",
//以及路由
routes: [
{
//专题详情页面
path:'/c/:id',
component: resolve => require(['../components/common/ZhuanTi.vue'], resolve),
meta: {title:'专题详情'}
},
{
//文章详情页面
path:'/p/:id',
component: resolve => require(['../components/common/Essay.vue'], resolve),
meta: {title:'文章详情'}
},
{
// 个人中心组件
path:'/u',
【Vue的一级路由和二级路由】component: resolve => require(['../components/page/User.vue'], resolve),
meta: {title:'个人中心'}
},
]
最后：二级路由的配置
import Vuefrom 'vue';
import Routerfrom 'vue-router';
Vue.use(Router);
export default new Router({
//去除路径中的#标志
mode:"history",
//一级路由
routes: [
{
//消息组件（一级路由）
path:'/notifications',
component: resolve => require(['../components/page/Notifications.vue'], resolve),
meta: {title:'消息'},
//二级路由开始
children:[
{
path:'/comments',
component: resolve => require(['../components/pinglun/PingLun.vue'], resolve),
meta: {title:'评论'},
},
{
path:'/chats',
component: resolve => require(['../components/pinglun/JianXin.vue'], resolve),
meta: {title:'简信'},
},
{
path:'/requests',
component: resolve => require(['../components/pinglun/TouGao.vue'], resolve),
meta: {title:'投稿请求'},
},
{
path:'/likes',
component: resolve => require(['../components/pinglun/Like.vue'], resolve),
meta: {title:'喜欢和赞'},
},
{
path:'/follows',
component: resolve => require(['../components/pinglun/GuanZhu.vue'], resolve),
meta: {title:'关注'},
}
{
path:'/others',
component: resolve => require(['../components/pinglun/TiXing.vue'], resolve),
meta: {title:'提醒'},
}
]
},
]

Vue的一级路由和二级路由

推荐阅读

高铁能带打火机吗

子宫肌瘤症状女人脸上长出它当心子宫不保

小苏打洗鞋是泡还是刷

荣耀10怎样开后盖

煮熟桃子可以存放多久熟桃子如何保存时间长

签了三方协议没去什么后果

珠海口岸有几个关口珠海口岸有几个？

保定住房公积金怎么提取出来？

马头琴是哪个民族的乐器

鲁大师卸载不了怎么处理

第九大陆职业包括哪些

做短视频用什么软件最好,不同类型等你来选

pdf文件

青汁喝多了有什么副作用

用通俗易懂的故事解读疾病_一辈子你都不会得大病_不信你就看看这几个故事！

Verizon狂裁44000名老员工（中年人，愿您的能力和年龄一起增长）

自动挡车换挡拨片有什么作用换挡拨片对自动挡有用吗

mysql集群版需要几台服务器 mysql服务器群集

昭平银杉茶怎么样

全面战争战锤2伊姆瑞克怎么破局全面战争战锤2伊姆瑞克破局