Lifecycle hooks

Vue instances and Vue components, in general, have an associated lifecycle. You can use lifecycle hooks to add your own logic at certain points of this lifecycle.

The following example has been taken from the official documentation; it demonstrates how we can write a lifecycle hook that will be invoked when an instance has just been created:

new Vue({ 
  data: { 
    a: 1 
  }, 
  created: function () { 
    console.log(`a is: ${this.a}`); // "a is: 1" 
  } 
})

In the preceding code, the this keyword points to the current Vue (component) context, also called the VM. Check out the following documentation to find out more: https://vuejs.org/v2/guide/instance.html.

There are quite a few different hooks, as shown in the following diagram:

Don't worry, ...

Get Learn TypeScript 3 by Building Web Applications now with the O’Reilly learning platform.

O’Reilly members experience books, live events, courses curated by job role, and more from O’Reilly and nearly 200 top publishers.