Different versions of vue routers in L9-start and L9-end package.json files
So I was trying to follow along the coding, I was not able to move forward after removing the watchEffect and replacing it with beforeRouteEnter. The issue I suppose was with the vue-router version installed. I compared the L9-start and L9-end package json and found the vue-router version were actually different. So I changed my vue-router version with the one from L9-end and it worked.
This lesson seems a bit out of date now sadly - it’s still borked in December.
If you follow the lesson you get an invalid route guard that stops it from working.
Like this helpful post suggests, if you upgrade vue-router (and I also had to upgrade vue to 3.2.26 for it to let me upgrade vue-router) then the code no longer errors - but it doesn’t work anymore. Changing pages using next or previous doesn’t execute the beforeRouteUpdate, so the event list doesn’t update anymore.
Hi @Bruce9000, I'm still learning Vue here too, so I may be misunderstanding what you're saying, but I think you're describing a problem that's actually addressed later in the lesson, by using beforeRouteUpdate. Scroll down the lesson page to "🛑 Problem: Pagination stopped working" and you'll probably find that's what you need.
Aside from that, updating the dependencies seems to do the trick for the key issue - well done and thanks, @platoputhur, for figuring this out.
I've opened a PR (linked above for anyone who might find it helpful) with an updated package-lock.json so hopefully the tutorial repo can be updated soon.
I even had problems with L8 and the provider/inject the Gstore.flashMessage until I updated vue/vue router to latest version.