Vue keep-alive

[Lindysen]

Vue内部把DOM节点抽象成一个个VNode，keep-alive组件缓存的是VNode不是真实DOM节点，它将满足条件（pruneCache与pruneCache）的组件在cache对象中缓存起来，在需要重新渲染的时候再将vnode节点从cache对象中取出并渲染。

keep-alive

created() {
 /* 缓存对象 */
    this.cache = Object.create(null)
}
destoryed() {//在组件被销毁的时候清除cache缓存中的所有组件实例。
     for (const key in this.cache) {
        pruneCacheEntry(this.cache[key])
        // this.cache[key]是vnode
        // key vnode.key or id+tag
    }
}

获取slot 插槽中的组件

render() {
    /* 得到slot插槽中的第一个组件 */
    const vnode: VNode = getFirstComponentChild(this.$slots.default)
    const componentOptions =  vnode && vnode.componentOptions;

}