## Introduction **Lifecycle Hooks** are special methods, or peepholes to give us ideas on how things work behind-the-scenes of a library (React) or framework (Vue). These methods allow you to know when a component is created, added to the DOM, updated, or destroyed in the Vue instance. **Note :** All lifecycle hooks automatically have their this context bound to the instance, so that you can access data, computed properties, and methods. ## The Hooks ![Lifecycle](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/9i9mpo1pogaav6q7puoe.png) ## The Creation Hooks **beforeCreate** The `beforeCreate` hook runs whenever a component is initialized. None of the data, or methods are setup during this. ```javascript ``` **created** During the `created` hook, we can access all reactive data members and methods as part of our component. The DOM is yet to be mounted. ```javascript ``` ## The Mounting Hooks **beforeMount** The `beforeMount` hook runs before the initial render of the components and after the template or render functions have been compiled. ```javascript ``` **mounted** In the `mounted` hook, we have access to the reactive components, and rendered DOM (via this.$el). ```javascript ``` ## The Updating Hooks **beforeUpdate** The `beforeUpdate` hook runs after data changes on your component, right before the DOM is patched and re-rendered. ```javascript ``` **updated** The `updated` hook runs after data changes on your component and the DOM re-renders. ```javascript ``` ## The Destroying Hooks **beforeDestroy** The `beforeDestroy` is invoked right before teardown or destroyed. The component completely exists and is totally functional. ```javascript ``` **destroyed** The `destroyed` hook is when everything part of the component has been torn down, or destroyed from existence. This method is useful for all cleanup required within the component. ```javascript ``` For more to learn about VueJS, click [here](www.v3.vuejs.org).

amolikvivian

The Lifecycles of Vue.js

Join Our Newsletter. No Spam, Only the good stuff.