import Vue from 'vue'
import VueRouter from 'vue-router'
Vue.use(VueRouter)
const routes = [{
meta: {
title: '基本信息查询'
},
path: '/ElevatorDimension',
name: 'ElevatorDimension',
component: () => import('../components/ElevatorQuery/ElevatorDimension.vue')
}, {
meta: {
title: '任务列表'
},
path: '/task',
name: 'task',
component: () => import('../components/page/task.vue')
},
]
}
]
const router = new VueRouter({
mode: 'history', //去掉url中的#
routes
})
// 导航守卫
router.beforeEach((to, from, next) => {
/* 路由发生变化修改页面title */
if (to.meta.title) {
document.title = to.meta.title
}
next()
})
export default router
当你使用 history 模式时,URL 就像正常的 url,例如 http://yoursite.com/user/id
,也好看!
不过这种模式要玩好,还需要后台配置支持。因为我们的应用是个单页客户端应用,如果后台没有正确的配置,当用户在浏览器直接访问 http://oursite.com/user/id
就会返回 404,这就不好看了。
对于 Node.js/Express,请考虑使用 connect-history-api-fallback 中间件