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 O’Reilly online learning.

O’Reilly members experience live online training, plus books, videos, and digital content from 200+ publishers.