router.js的常用写法
例如1:使用变量,减少代码量{path:'/pages/:name',//主页面,各列表页//name:'mylist',component:()=>import('@/dymatrixfrontweb/views/pageList/pageList.vue'),meta:{mainPage:true}}例如2:规范写法,清晰明了,父子组件按层级...
·
例如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)
}
更多推荐
已为社区贡献5条内容
所有评论(0)