keep-alive和activated的用法

首先,我们要知道 keep-alive 和 activated 是什么 如何使用。

1.<keep-alive> 是 Vue 的内置组件,能在组件切换过程中将状态保留在内存中,防止重复渲染DOM。

2.activated():在vue对象存活的情况下,进入当前存在activated()函数的页面时,一进入页面就触发;可用于初始化页面数据等

接下来我们就用keep-alive 和  activated 配合 实现   电商移动端项目 中  在首页点击任意商品 进入商品详情页,返回时还在原位置的效果。

实现的效果如下:

1---进入移动端

2----进入商品详情页 


3----返回


代码演示:






第一次总结 有不足的地方,欢迎大佬指正!

©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。