[Vuejs]-Vue JS maintaining route when linking to nested routes

by

0👍

✅

Component B shouldn’t be re-drawing when you move between C and D unless you set canReuse to false: http://vuejs.github.io/vue-router/en/pipeline/can-reuse.html

If you are being scrolled to the top it’s probably because when the content of C or D disappears, the site height is reduced to just the header, and thus automatically scrolled up. You could try making component B height:100% so it doesn’t shrink

edit: nested routes actually solve this. That way you are never actually re-routing to B, you’re just navigating within the subroutes of B:

'/:param_one': {
    component: require('./RouteOne.vue'),
    name:'RouteOne',
    subRoutes:{
        '/:param_two':{
            component:require('./views/Dashboard/OtherRoute.vue'),
            name:'OtherRoute'
        }
    }
}

Leave a comment