例如1:使用变量,减少代码量
{ path: '/pages/:name', // 主页面,各列表页 // name: 'mylist', component: () => import ('@/dymatrixfrontweb/views/pageList/pageList.vue'), meta: { mainPage: true } }例如2:规范写法,清晰明了,父子组件按层级
{ path: '/', redirect: '/pages' }, {、 path: '/pages', component: () => import('@/views/PagesView'), children: [{ path: '', redirect: '/pages/BaseInstall' }, { path: 'baseInstall', name: 'baseInstall', component: () => import('@/views/BaseInstall') }, ] }vue scrollBehavior 切换到新路由时,页面要滚动到顶部或保持原先的滚动位置
const router = new Router({ // mode: 'history', routes, base: process.env.BASE_URL, scrollBehavior(to, from, savedPosition) { if (savedPosition) { return savedPosition } else { if (to.hash) { return { selector: to.hash } } return { x: 0, y: 0 } } } })当你的Vue项目在当前的路由下企图再次导航到当前路由时就会出现NavigationDuplicated的问题(通俗来讲就是多次进入了同一个path
const originalPush = Router.prototype.push Router.prototype.push = function push(location) { return originalPush.call(this, location).catch(err => err) }
