{"action":"opened","issue":{"url":"https://api.github.com/repos/Lindysen/Blog/issues/26","repository_url":"https://api.github.com/repos/Lindysen/Blog","labels_url":"https://api.github.com/repos/Lindysen/Blog/issues/26/labels{/name}","comments_url":"https://api.github.com/repos/Lindysen/Blog/issues/26/comments","events_url":"https://api.github.com/repos/Lindysen/Blog/issues/26/events","html_url":"https://github.com/Lindysen/Blog/issues/26","id":488897904,"node_id":"MDU6SXNzdWU0ODg4OTc5MDQ=","number":26,"title":"Vue keep-alive","user":{"login":"Lindysen","id":33708359,"node_id":"MDQ6VXNlcjMzNzA4MzU5","avatar_url":"https://avatars2.githubusercontent.com/u/33708359?v=4","gravatar_id":"","url":"https://api.github.com/users/Lindysen","html_url":"https://github.com/Lindysen","followers_url":"https://api.github.com/users/Lindysen/followers","following_url":"https://api.github.com/users/Lindysen/following{/other_user}","gists_url":"https://api.github.com/users/Lindysen/gists{/gist_id}","starred_url":"https://api.github.com/users/Lindysen/starred{/owner}{/repo}","subscriptions_url":"https://api.github.com/users/Lindysen/subscriptions","organizations_url":"https://api.github.com/users/Lindysen/orgs","repos_url":"https://api.github.com/users/Lindysen/repos","events_url":"https://api.github.com/users/Lindysen/events{/privacy}","received_events_url":"https://api.github.com/users/Lindysen/received_events","type":"User","site_admin":false},"labels":[],"state":"open","locked":false,"assignee":null,"assignees":[],"milestone":null,"comments":0,"created_at":"2019-09-04T01:47:59Z","updated_at":"2019-09-04T01:47:59Z","closed_at":null,"author_association":"OWNER","body":"Vue内部把DOM节点抽象成一个个VNode，keep-alive组件缓存的是VNode不是真实DOM节点，它将满足条件（pruneCache与pruneCache）的组件在cache对象中缓存起来，在需要重新渲染的时候再将vnode节点从cache对象中取出并渲染。\r\n```\r\nkeep-alive\r\n\r\ncreated() {\r\n /* 缓存对象 */\r\n    this.cache = Object.create(null)\r\n}\r\ndestoryed() {//在组件被销毁的时候清除cache缓存中的所有组件实例。\r\n     for (const key in this.cache) {\r\n        pruneCacheEntry(this.cache[key])\r\n        // this.cache[key]是vnode\r\n        // key vnode.key or id+tag\r\n    }\r\n}\r\n\r\n获取slot 插槽中的组件\r\n\r\nrender() {\r\n    /* 得到slot插槽中的第一个组件 */\r\n    const vnode: VNode = getFirstComponentChild(this.$slots.default)\r\n    const componentOptions =  vnode && vnode.componentOptions;\r\n\r\n}\r\n\r\n```"}}
{"actor":{"display_login":"Lindysen"}}