vue router.js 传值,根据不同type显示不同内容
router.js
javascript
import Vue from 'vue'
import Router from 'vue-router'
// 路由前缀
const { prefixBasePath } = require('../../config/basePath')
// 解决重复点击一个路由报错问题
const originalPush = Router.prototype.push
Router.prototype.push = function push(location) {
return originalPush.call(this, location).catch(err => err)
}
Vue.use(Router)
const router = new Router({
base: prefixBasePath, // 路由前缀
mode: 'history',
routes: [
{
path: '/',
redirect: '/login'
},
{
name: 'login',
path: '/login',
component: resolve => (require(['@/components/login'], resolve)),
meta: {
title: '登录',
keepAlive: true
},
},
{
name: 'home',
path: '/home',
component: resolve => (require(['@/components/header/haveMenuIndex'], resolve)),
meta: {
title: '首页',
keepAlive: true
},
children: [
{
name: 'mine',
path: '/mine',
component: resolve => (require(['@/components/mine'], resolve)),
meta: {
title: '个人中心',
keepAlive: true,
},
children: [
{
name: 'news',
path: 'news/:type', // 完整路由:/about/news/1
component: resolve => require(['@/components/mine/financialAssist'], resolve),
meta: {
title: null,
keepAlive: true,
},
beforeEnter: (to, from, next) => {
// 根据type参数设置meta字段
to.meta.title = to.params.type == 1 ? '已读信息' : to.params.type == 2 ? '未读信息' : '';
next();
}
},
]
},
{
name: 'about',
path: '/about',
component: resolve => (require(['@/components/about'], resolve)),
meta: {
title: '关于',
keepAlive: true,
}
},
]
},
]
})
// 路由守卫
router.beforeEach((to, from, next) => {
next()
})
export default router