## 前言 本文主要分析一个场景：在某些业务场景中我们需要页面初次进入的时候，刷新数据，返回页面时保存历史数据，也就是保存页面的状态，包括数据以及页面位置等。 ## 解决思路 ### keep-alive 这个组件可以保持让其嵌套的组件保持组件缓存状态，再次进入时不重新进入生命周期，避免多次渲染组件，过渡浪费性能。用法是： ~~~ <keep-alive> <component> <!-- 组件将被缓存 --> </component> </keep-alive> ~~~ 如果你希望整个站点都被缓存，那么可以这样写：希望只在进入时加载，可以把获取数据的部分写在created的生命周期函数中，这样只有进入时执行一次。 `<keep-alive><router-view></router-view></keep-alive>`