Vue中如何使用keep-alive组件实现实例缓存功能？

本文共计993个文字，预计阅读时间需要4分钟。

需求：home组件中含有一个name的数据。修改此数据后，切换到其他组件，再切回home组件，希望home中的name值是之前修改过的值。希望组件有缓存。使用keep-alive。

需求：
home 组件中有一个 name 的 data 数据。这个数据修改之后，再切换到其他的组件。再切换到 home 组件，希望 home 中 name 这个值是之前修改过的值。希望组件有缓存。
keep-alive 的使用方式：
将要缓存的组件使用 keep-alive 包裹住即可。
keep-alive优点的介绍：
1. 切换组件时，当前组件不会触发销毁的生命周期钩子。也就是说不会销毁了。
2. 切换回来时，也不会重新创建。