websmurf
commented
3 years ago Oki, added a composition api component and it's working instantly there as well; That means this issue is most likely caused by vue-class-component I guess?
This is basically a copy of the issue I've reported to vue-router-next: https://github.com/vuejs/vue-router-next/issues/739
Not sure which of the two causes this issue though.
ygj6
Version
^8.0.0-rc.1
Reproduction link
https://github.com/websmurf/vue-router-async-test
Steps to reproduce
Run the provided application in the test repository, and make sure your console is open.
If you click the "Page 1" link, the console shows "Page 1" If you click the "Page 2" link, the console shows "Page 2" If you click the "Async Page 1" link, the console shows nothing If you click the "Async Page 2" link, the console shows nothing
Now, click the Async Page 1 link again, now the console shows 'Async page 2' Also, when directly visiting the async pages, no beforeRouteEnter event is triggered.
What is expected?
I would expect the beforeRouteEnter method to be called in every of these cases.
What is actually happening?
The beforeRouteEnter method is only called for the sync loaded components. Only once the page is loaded once, the beforeRouteEnter method is called
We are in the process of migration our old Vue2 application to Vue3 and Vite, hence the usage of vue-class-component (since we use it already and it means converting lesser code).
Not sure if this is actually caused by vue-router; or by vue-class-component; will adjust the example to include a Composition API set as well.