theluyuan/vue3-yuanma
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

feat(devtools): improved KeepAlive support

Browse Source 
This change allows the devtools to access the cached vnodes from the KeepAlive component in order to display them as inactive in the components tree
This commit is contained in:
Guillaume Chau 2021-04-23 16:52:28 +02:00
parent 060c5f1d0a
commit 03ae3006e1
1 changed files with 15 additions and 0 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

15
packages/runtime-core/src/components/KeepAlive.ts
View File

@ -34,6 +34,7 @@ import {
} from '../renderer' } from '../renderer'
import { setTransitionHooks } from './BaseTransition' import { setTransitionHooks } from './BaseTransition'
import { ComponentRenderContext } from '../componentPublicInstance' import { ComponentRenderContext } from '../componentPublicInstance'
import { devtoolsComponentAdded } from '../devtools'
type MatchPattern = string | RegExp | string[] | RegExp[] type MatchPattern = string | RegExp | string[] | RegExp[]
@ -95,6 +96,10 @@ const KeepAliveImpl = {
const keys: Keys = new Set() const keys: Keys = new Set()
let current: VNode | null = null let current: VNode | null = null
if (__DEV__ || __FEATURE_PROD_DEVTOOLS__) {
;(instance as any).__v_cache = cache
}
const parentSuspense = instance.suspense const parentSuspense = instance.suspense
const { const {
@ -132,6 +137,11 @@ const KeepAliveImpl = {
invokeVNodeHook(vnodeHook, instance.parent, vnode) invokeVNodeHook(vnodeHook, instance.parent, vnode)
} }
}, parentSuspense) }, parentSuspense)
if (__DEV__ || __FEATURE_PROD_DEVTOOLS__) {
// Update components tree
devtoolsComponentAdded(instance)
}
} }
sharedContext.deactivate = (vnode: VNode) => { sharedContext.deactivate = (vnode: VNode) => {
@ -147,6 +157,11 @@ const KeepAliveImpl = {
} }
instance.isDeactivated = true instance.isDeactivated = true
}, parentSuspense) }, parentSuspense)
if (__DEV__ || __FEATURE_PROD_DEVTOOLS__) {
// Update components tree
devtoolsComponentAdded(instance)
}
} }
function unmount(vnode: VNode) { function unmount(vnode: VNode) {