fix(reactivity): self-referencing computed should refresh

ref: https://github.com/vuejs/core/pull/11797#issuecomment-2330738633
This commit is contained in:
Evan You 2024-09-05 18:58:40 +08:00
parent 716275d1b1
commit e84c4a608e
No known key found for this signature in database
GPG Key ID: 00E9AB7A6704CE0A
3 changed files with 5 additions and 7 deletions

View File

@ -594,7 +594,7 @@ describe('reactivity/computed', () => {
v.value += ' World' v.value += ' World'
await nextTick() await nextTick()
expect(serializeInner(root)).toBe('Hello World World World') expect(serializeInner(root)).toBe('Hello World World World World')
// expect(COMPUTED_SIDE_EFFECT_WARN).toHaveBeenWarned() // expect(COMPUTED_SIDE_EFFECT_WARN).toHaveBeenWarned()
}) })
@ -892,7 +892,7 @@ describe('reactivity/computed', () => {
v.value += ' World' v.value += ' World'
await nextTick() await nextTick()
expect(serializeInner(root)).toBe( expect(serializeInner(root)).toBe(
'Hello World World World | Hello World World World', 'Hello World World World World | Hello World World World World',
) )
}) })
@ -962,6 +962,7 @@ describe('reactivity/computed', () => {
}) })
}) })
// #11797
test('should prevent endless recursion in self-referencing computed getters', async () => { test('should prevent endless recursion in self-referencing computed getters', async () => {
const Comp = defineComponent({ const Comp = defineComponent({
data() { data() {
@ -998,7 +999,7 @@ describe('reactivity/computed', () => {
}) })
const root = nodeOps.createElement('div') const root = nodeOps.createElement('div')
render(h(Comp), root) render(h(Comp), root)
expect(serializeInner(root)).toBe(`<button>Step</button><p></p>`) expect(serializeInner(root)).toBe(`<button>Step</button><p>Step 1</p>`)
triggerEvent(root.children[1] as TestElement, 'click') triggerEvent(root.children[1] as TestElement, 'click')
await nextTick() await nextTick()
expect(serializeInner(root)).toBe(`<button>Step</button><p>Step 2</p>`) expect(serializeInner(root)).toBe(`<button>Step</button><p>Step 2</p>`)

View File

@ -111,9 +111,9 @@ export class ComputedRefImpl<T = any> implements Subscriber {
* @internal * @internal
*/ */
notify(): void { notify(): void {
this.flags |= EffectFlags.DIRTY
// avoid infinite self recursion // avoid infinite self recursion
if (activeSub !== this) { if (activeSub !== this) {
this.flags |= EffectFlags.DIRTY
this.dep.notify() this.dep.notify()
} else if (__DEV__) { } else if (__DEV__) {
// TODO warn // TODO warn

View File

@ -345,9 +345,6 @@ function isDirty(sub: Subscriber): boolean {
* @internal * @internal
*/ */
export function refreshComputed(computed: ComputedRefImpl): false | undefined { export function refreshComputed(computed: ComputedRefImpl): false | undefined {
if (computed.flags & EffectFlags.RUNNING) {
return false
}
if ( if (
computed.flags & EffectFlags.TRACKING && computed.flags & EffectFlags.TRACKING &&
!(computed.flags & EffectFlags.DIRTY) !(computed.flags & EffectFlags.DIRTY)