how to respond to changes in $router.getRoutes()

[mattsouth]

Im interested in dynamically adding routes to an application depending on whether a user is authenticated or not. I find I can do this on mounted in App.vue with $router.addRoute() but that if I do this, calls to $router.hasRoute() in my sub components dont see the new routes. It seems that $router isnt reactive - the documentation only indicates that $route is reactive. I wonder if this is expected behaviour and if so, whether there is an alternative strategy for achieving this goal?

[posva]

Im interested in dynamically adding routes to an application depending on whether a user is authenticated or not.

I would recommend you not to do that because there isn't any benefit from conditionally adding routes, it just makes things more complicated. Instead, add a navigation guard that cancels the navigation to these routes if the user is not authenticated.

[mattsouth]

This is more or less the strategy that Ive accepted but I wanted to explore whether conditionally adding routes might reduce the bundle size. You dont think it could do that?

[posva]

It's unlikely to have an impact in your bundle size as the routes definitions themselves are pretty small. You can still give it a try but you can lazy load any modules within navigation guards to keep route definitions to 0 dependencies.