router.js的常用写法

例如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)
}