Vue Lifecycle Hooks


Lifecycle hooks in Vue are used to run code at different stages of the Vue application's lifecycle.

Lifecycle Hook Description
beforeCreate happens before all the other lifecycle hooks
created the component is initialized, and we can access component instance properties
beforeMount the component is not mounted yet, so we can not access DOM elements
mounted the component is mounted to the DOM tree, so we can access DOM elements
beforeUpdate happens when Vue's reactive system has detected a change that requires a new rendering
updated happens right after the DOM tree has updated
beforeUnmount happens just before a component is removed from the DOM
unmounted happens after a component is removed from the DOM
errorCaptured happens when an error happens in a child/descendant component
renderTracked happens when a render function is set to track, or monitor, a reactive component
renderTriggered happens when there is a change in a tracked reactive component, so that a new render is triggered
activated happens when a cached dynamic component is added (but is already in the DOM)
deactivated happens when a cached dynamic component is removed (but not from the DOM)
serverPrefetch happens during server-side rendering (SSR)

Copyright 1999-2023 by Refsnes Data. All Rights Reserved.