fix(customFormatter): properly accessing ref value during debugger (#12948)

This commit is contained in:
edison 2025-03-14 08:19:06 +08:00 committed by GitHub
parent 636a8619f0
commit fdbd026583
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
1 changed files with 7 additions and 2 deletions

View File

@ -4,6 +4,8 @@ import {
isReadonly, isReadonly,
isRef, isRef,
isShallow, isShallow,
pauseTracking,
resetTracking,
toRaw, toRaw,
} from '@vue/reactivity' } from '@vue/reactivity'
import { EMPTY_OBJ, extend, isArray, isFunction, isObject } from '@vue/shared' import { EMPTY_OBJ, extend, isArray, isFunction, isObject } from '@vue/shared'
@ -34,13 +36,16 @@ export function initCustomFormatter(): void {
if (obj.__isVue) { if (obj.__isVue) {
return ['div', vueStyle, `VueInstance`] return ['div', vueStyle, `VueInstance`]
} else if (isRef(obj)) { } else if (isRef(obj)) {
// avoid tracking during debugger accessing
pauseTracking()
const value = obj.value
resetTracking()
return [ return [
'div', 'div',
{}, {},
['span', vueStyle, genRefFlag(obj)], ['span', vueStyle, genRefFlag(obj)],
'<', '<',
// avoid debugger accessing value affecting behavior formatValue(value),
formatValue('_value' in obj ? obj._value : obj),
`>`, `>`,
] ]
} else if (isReactive(obj)) { } else if (isReactive(obj)) {