Description
What problem does this feature solve?
It is a common need to create a route guard that checks if a user or resource is authorized or authenticated activating a route. This currently does not exist, and the existing per route beforeEnter handler really aligns with component activation not route activation. I think it makes more sense to include auth type guards in the url/routing module and not the component because the guard logic is shared among some large percentage of the routes and doesn't have relate specifically to component logic. And often you want this logic to apply to some routes not all routes. Currently to meet this need you have to:
- Watch $route. Not ideal, because you have to roll your own logic to match the guard to the route.
- Use the global beforeEach. Again, not ideal because you have to roll your own logic to apply guard to selected routes.
- Use beforeRouteUpdate and beforeRouteEnter in the component. This isn't ideal because the global auth guards should not be buried in a component and they don't use any component logic. The guard is related to the route.
- Reach for the beforeEnter handler, which only activates when the route resolution is changed but many people expect it to be called when the the route is matched
I think there is a need for this based the necessity of a call out in the documentation, a handful of issues in the repo, and questions on the forum. The current route paradigm makes sense and has parity when you are talking about a component (enter, update, leave). But when you talk about a route there is a parity mismatch. You would expect a route handler to be called an time the route url changes and a route is matched.
I see there is was a proposal to add a beforeUpdate, which I think was rightfully closed with an addition to the component.
#1577
There was also a proposal to deprecate beforeEnter, which I think actually makes sense because again beforeEnter is confusing, but without a replacement i understand why it was closed.
#2540
Some more relevant issues and questions:
- beforeEnter next callback is not called #2600
- Route push to same named route with different params will not execute beforeRoute guards #1012
- https://forum.vuejs.org/t/beforeenter-doesnt-catch-param-changes/97451
- https://forum.vuejs.org/t/how-to-invoke-beforeenter-everytime-route-param-changes-in-the-same-path/97551
- https://forum.vuejs.org/t/vue-router-beforeenter-guard-not-working-on-url-change/42300
- https://forum.vuejs.org/t/vue-router-beforeenter-doesnt-work-properly-for-children-path/20019
- https://forum.vuejs.org/t/vue-router-trigger-beforeenter-in-all-segments-of-the-url/37462
What does the proposed API look like?
Deprecate confusing beforeEnter that really aligns with the component not the route and create a handler called before, beforeNavigate, or beforeMatch that is called before a route is matched and pushed onto the stack.