vue3中keep-alive实现路由缓存

在商城类项目中我们会遇到这样的需求，一个商品列表页，点击其中一个商品进到详情页返回后还是原来的列表状态，为此我们可以使用vue里面的一个组件keep-alive，它可以用来缓存不活动的组件，它本身不会渲染。

 

1. 可以在路由里面配置需要缓存的路由页面，router/index.js文件

2. 在app.vue写以下代码，keep-alive包含需要缓存的组件

 3. 实现页面滚动行为，回到原来的位置

以上就是vue3中的实现。