diff --git a/src/core/observer/traverse.ts b/src/core/observer/traverse.ts index 0fe671c06cf..5f4e378b194 100644 --- a/src/core/observer/traverse.ts +++ b/src/core/observer/traverse.ts @@ -1,6 +1,7 @@ import { _Set as Set, isObject, isArray } from '../util/index' import type { SimpleSet } from '../util/index' import VNode from '../vdom/vnode' +import { isRef } from '../../v3' const seenObjects = new Set() @@ -35,6 +36,8 @@ function _traverse(val: any, seen: SimpleSet) { if (isA) { i = val.length while (i--) _traverse(val[i], seen) + } else if (isRef(val)) { + _traverse(val.value, seen) } else { keys = Object.keys(val) i = keys.length diff --git a/test/unit/features/v3/apiWatch.spec.ts b/test/unit/features/v3/apiWatch.spec.ts index 52025afa96a..c1b301ae9e8 100644 --- a/test/unit/features/v3/apiWatch.spec.ts +++ b/test/unit/features/v3/apiWatch.spec.ts @@ -144,6 +144,20 @@ describe('api: watch', () => { expect(dummy).toBe(1) }) + it('deep watch w/ raw refs', async () => { + const count = ref(0) + const src = reactive({ + arr: [count] + }) + let dummy + watch(src, ({ arr: [{ value }] }) => { + dummy = value + }) + count.value++ + await nextTick() + expect(dummy).toBe(1) + }) + it('watching multiple sources', async () => { const state = reactive({ count: 1 }) const count = ref(1)