fix(reactivity): self-referencing computed should refresh
ref: https://github.com/vuejs/core/pull/11797#issuecomment-2330738633
This commit is contained in:
parent
716275d1b1
commit
e84c4a608e
|
@ -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>`)
|
||||||
|
|
|
@ -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
|
||||||
|
|
|
@ -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)
|
||||||
|
|
Loading…
Reference in New Issue