Watch callback not triggered for props of router-view

If a component prop passed through a nested route been changed, watch callback does not triggered: http://jsfiddle.net/jh9pk6jc/1/ Not sure if it is a vue-router issue

[LinusBorg]

Oh.

I didn’t express myself correctly, but the point is the same:

The UserHome components only gets rendered when you visits /user/:id, not when you visit one of the other routes, user/:id/profile, for example.

As you only have one <router-link> that renders the UserHome component (/user/foo), the id will not change from the perspective of this component. It will only ever receive the intial value foo of that prop during render. That the id is bar when you are in another routehas no effect on UserHome, because the component will not be active in that moment.

So: The watch will only be triggered if you switch from one route like /user/foo to the same route with a different id, e.g. /user/bar - not a different route, e.g. /user/bar/profile

To demonstrate this, I have added a second route that will render UserHome as well, /user/bar, here:

http://jsfiddle.net/Linusborg/jh9pk6jc/3/

If you switch between the first two links, you will see the watch being triggered in the console.

And again: If it should trigger immediatly, use the immediate option

[LinusBorg]

The functionality also works across different routes:

http://jsfiddle.net/Linusborg/jh9pk6jc/5/

as long as it renderes the same component - that was your problem, not routes / route-params.