Leave hook is not called when url Param changes in parameterized Route

Hi, I have a problem that the leave hook seems not to be called for routes with parameters when navigating to the “same” route but with different parameter.

router.on(
    '/foo/:id', 
    ({ data }) => console.log('Routing to', data.id),
    { 
        leave: () => console.log('Executing leave hook')
    }
);

router.navigate('/foo/123')
router.navigate('/foo/321')  // leave hook is not called
router.navigate('/home')     // leave hook is called

The same actually happens for query parameters. I would’ve expected that any navigate call also calls the hooks.

[rjgamble]

I see. In such cases I usually question whether such logic needs to be in the routing layer. Is it possible to shift it in another place.

Its a good question. Unfortunately in our case, the routing layer is the only option we have for detecting that navigation event and performing that disposal and cleanup. Not to mention, execution in the hooks already provides us with all the context we need to perform our cleanup.

[jackiems82]

Thank you for the feedback @krasimir. We added some guard handling on top of the leave hook to prevent losing unsaved changes. All of this works great on non-parameterized routes. But for a page where you can display editable documents in tabs it would not work. If you say it should be implemented outside of the general routing logic I need to see how I could implement that in our wrapping logic. In general I would still consider that as a route change. At least the vue-router does it the same way. Maybe others as well?