Learn Vue JS course Learn Javascript and Vue JS Learn VueJS course Learn VueJS Tutorial
Vue School Logo

The Vue.js 3 Masterclass

Get access to the most comprehensive Vue.js video library in the world. Over 300 video lessons including the newest Vue 3 features.

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.