beforeRouteEnter hook's next callback invoked with wrong instance

[nirazul]

Version

3.0.1

Reproduction link

https://codepen.io/Nirazul/pen/GOrjVW?editors=1010

Steps to reproduce

Follow these instructions to reproduce the issue:

1. Click on "Baz"
2. Click on "Bar"
3. Click on "Foo"
4. Click on "Baz" again

You should see that "$data" is empty.

It doesn't matter where you start as long as you follow the above order at some point. The behaviour is normal, when you leave out the second or third step.

What is expected?

The route succeeds in fetching the correct data in any order of navigation.

What is actually happening?

When I follow the pages in the order described in the reproduction steps section, the router fails to load one of the pages.

---

It most definitely has something to do with the transition mode "out-in". When I remove the attribute or use "in-out", everything seems to work normally.

[LinusBorg]

Certainly something top investigate - in the meantime, applying a key to the router-view make it work again:

<router-view :key="$route.path"></router-view>

Definitely has something to do with the transition, but I can't say what for the moment.

[nirazul]

@LinusBorg: Thanks for the quick answer! Unfortunately, $route.path turns out to break some other part of our app (when we have route pathes with params in them). I've changed it to route specific property in meta, which seems to work for both cases.

[PeachScript]

@LinusBorg I have the same problem, is there any update?

[LinusBorg]

You would read about it here if there was.

[PeachScript]

I also created a live demo: https://jsfiddle.net/hj1pbgfw/2/ , when I using transition with out-in mode, after 4 steps, I found 3 problems:

1. The mounted will be invoke after the next function from beforeRouteUpdate
2. The next function frombeforeRouteUpdate will get a destroyed instance and different with mounted gets
3. The destroyed instance still working, that means, if you listen instance event or bind element event in the instance, it will be triggered multiple times, because there has multiple same instances

[PeachScript]

@LinusBorg thanks for your quick reply, do you planning to fix it?

[LinusBorg]

Sure, when someone finds time to pick up the task. I won't as I don't know the internals that are involved well enough to debug it in a reasonable timeframe.

[PeachScript]

Well, 4 months have passed, I will make a PR if I can fix it, thanks.