diff --git a/packages/reactivity/__tests__/reactive.spec.ts b/packages/reactivity/__tests__/reactive.spec.ts index 1c25c49121b..1fb9857480b 100644 --- a/packages/reactivity/__tests__/reactive.spec.ts +++ b/packages/reactivity/__tests__/reactive.spec.ts @@ -314,6 +314,14 @@ describe('reactivity/reactive', () => { expect(isReactive(observed)).toBe(false) }) + test('a ref nested in a reactive', () => { + const obj = reactive(ref(1)) + const spy1 = vi.fn(() => obj.value) + effect(spy1) + obj.value = 2 + expect(isReactive(obj)).toBe(true) + }) + test('hasOwnProperty edge case: Symbol values', () => { const key = Symbol() const obj = reactive({ [key]: 1 }) as { [key]?: 1 } diff --git a/packages/reactivity/src/baseHandlers.ts b/packages/reactivity/src/baseHandlers.ts index 8f21e354002..90f8dd1bc5a 100644 --- a/packages/reactivity/src/baseHandlers.ts +++ b/packages/reactivity/src/baseHandlers.ts @@ -82,6 +82,9 @@ class BaseReactiveHandler implements ProxyHandler { return } + // only track its value if target is a ref + if (isRef(target) && key !== 'value') return (target as any)[key] + const targetIsArray = isArray(target) if (!isReadonly) { diff --git a/packages/reactivity/src/dep.ts b/packages/reactivity/src/dep.ts index 4ce73ac9954..74e90b7ad6c 100644 --- a/packages/reactivity/src/dep.ts +++ b/packages/reactivity/src/dep.ts @@ -1,6 +1,6 @@ import { extend, isArray, isIntegerKey, isMap, isSymbol } from '@vue/shared' import type { ComputedRefImpl } from './computed' -import { type TrackOpTypes, TriggerOpTypes } from './constants' +import { ReactiveFlags, type TrackOpTypes, TriggerOpTypes } from './constants' import { type DebuggerEventExtraInfo, EffectFlags, @@ -40,6 +40,9 @@ export class Dep { subsHead?: Link constructor(public computed?: ComputedRefImpl | undefined) { + // @ts-expect-error + this[ReactiveFlags.SKIP] = true + if (__DEV__) { this.subsHead = undefined }