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

Vue.js 3 Options API Masterclass

Forcing Vue Router to Destroy Component to Trigger Lifecycle Hooks thumbnail image

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

Forcing Vue Router to Destroy Component to Trigger Lifecycle Hooks

🚧 PLEASE NOTE: This masterclass is built with the Options API
vuejs-masterclass

The Composition API Masterclass is out!

In this lesson, we learn how to force Vue Router to destroy the component when we're navigating to another route that uses the same page component. This is important when you're relying on Vue's lifecycle hooks as we do to fetch vital data from our database.

If we do not force Vue Router 4 to destroy the current component when we're navigating to another route, it will reuse the same component and not re-fire the created hook.

We also get the user profile form saving data to the Firestore.