总结一下vue 得keeplive得实现原理

tech2022-10-14  107

keep live是vue得一个内置组件,能将组件缓存进内存,下次加载直接从内存中获取。

有2个属性 include = “a” 将缓存组件名为a得组件 exclude=‘a’ 组件名为a得不会被缓存 注:组件名是 组件内内得name值 跟data同级

提供两个生命周期 activated与deactivated

研究源码,分析原理(我用自己得话总结得)

分析keep-live组件内部 1.缓存得都是vnode节点,created周期里 创建了一个cache这么一个缓存容器,再销毁周期里 清除这个容器 2.通过 getFirstComponentChild来获取组件得name 3.通过matches 来匹配他缓存得条件, 4.如果需要缓存,遍历cache这个容器,如果之前缓存过得 覆盖,反之 存进去vnode

最新回复(0)