How to use keep-alive in vuejs?

1. We can achieve it by using

<keep-alive>
// Render component inside
</keep-alive>

special tag which has provided by vueJs.

2. use life cycle hooks:

a. activated()

b. deactivated()

The only disadvantage is that these components are kept in memory and therefore their state is saved and not reset.

You also lose lifecycle hooks like created, mounted, etc. since the component is not being rebuilt from scratch anymore. You can replace those lifecycle hooks with hooks that are specific to keep-alive components. For example:

https://v2.vuejs.org/v2/api/#activated

Whether keep-alive is a disadvantage or advantage is entirely up to your scenario. If you want to keep the state because you want to switch fast and often between the keep-alive components, it could be an advantage. If you really rely on a clean state through components being built and destroyed, it could be a disadvantage.