Vue.js 3 Options API Masterclass - Vue Router Middleware and Navigation Guards - 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.