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