Vue.js 3 Options API Masterclass
Plans from $25/month

This lesson is for members. Join us?

Subscribe now and get immediate access to this course, 30 more and all future Vue.js courses!

In Component Navigation Guards with Vue Router

In this lesson, we use Vue Router 4's in component navigation guard beforeRouteEnter to redirect a guest from the profile page to the home page since guests don't have a profile page.

We also examine another common use of an in component navigation guard by utilizing the beforeRouteLeave to alert a user to unsaved changes on the Thread Create page. In doing so, we also get some experience with Vue 3's watch option.