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'
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()
})
@ -892,7 +892,7 @@ describe('reactivity/computed', () => {
v.value += ' World'
await nextTick()
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 () => {
const Comp = defineComponent({
data() {
@ -998,7 +999,7 @@ describe('reactivity/computed', () => {
})
const root = nodeOps.createElement('div')
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')
await nextTick()
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
*/
notify(): void {
this.flags |= EffectFlags.DIRTY
// avoid infinite self recursion
if (activeSub !== this) {
this.flags |= EffectFlags.DIRTY
this.dep.notify()
} else if (__DEV__) {
// TODO warn

View File

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