Life cycle
Framework: Vue.js Life cycle
Categories:
Lifecycle Diagram
Lifecycle Hooks Explain
| Name | Description | Explain |
|---|---|---|
| beforeCreate | Instance is initialized. | After props resolution, before processing other options such as data() or computed. |
| created | After the instance has finished processing all state-related options. | The instance has finished create, and everything is setting up except $el |
| beforeMount | Before the component is to be mounted. | Component has finished setting up its reactive state, but no DOM nodes have been created yet |
| mounted | After the component has been mounted. | All of its synchronous child components have been mounted |
| beforeUpdate | Before the component is about to update its DOM tree due to a reactive state change. | This hook can be used to access the DOM state before Vue updates the DOM |
| updated | After the component has updated its DOM tree | This hook is called after any DOM update of the component |
| beforeUnmount | Before a component instance is to be unmounted. | When this hook is called, the component instance is still fully functional. |
| unmounted | After the component has been unmounted. | All of its associated reactive effects (render effect and computed / watchers created during setup()) have been stopped. |