fix(defineModel): correct update with multiple changes in same tick (#11430)

close #11429
This commit is contained in:
Tycho 2024-07-24 23:25:22 +08:00 committed by GitHub
parent 422ef34e48
commit a18f1ecf05
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
2 changed files with 20 additions and 12 deletions

View File

@ -614,24 +614,23 @@ describe('useModel', () => {
})
test('set no change value', async () => {
let changeChildMsg: (() => void) | null = null
let changeChildMsg!: (val: string) => void
const compRender = vi.fn()
const setValue = vi.fn()
const Comp = defineComponent({
props: ['msg'],
emits: ['update:msg'],
setup(props) {
const childMsg = useModel(props, 'msg')
changeChildMsg = () => {
childMsg.value = childMsg.value
}
changeChildMsg = (val: string) => (childMsg.value = val)
return () => {
return childMsg.value
}
},
})
const msg = ref('HI')
const defaultVal = 'defaultVal'
const msg = ref(defaultVal)
const Parent = defineComponent({
setup() {
return () =>
@ -639,7 +638,7 @@ describe('useModel', () => {
msg: msg.value,
'onUpdate:msg': val => {
msg.value = val
compRender()
setValue()
},
})
},
@ -648,8 +647,14 @@ describe('useModel', () => {
const root = nodeOps.createElement('div')
render(h(Parent), root)
expect(compRender).toBeCalledTimes(0)
changeChildMsg!()
expect(compRender).toBeCalledTimes(0)
expect(setValue).toBeCalledTimes(0)
changeChildMsg(defaultVal)
expect(setValue).toBeCalledTimes(0)
changeChildMsg('changed')
changeChildMsg(defaultVal)
expect(setValue).toBeCalledTimes(2)
expect(msg.value).toBe(defaultVal)
})
})

View File

@ -33,7 +33,7 @@ export function useModel(
const res = customRef((track, trigger) => {
let localValue: any
let prevSetValue: any
let prevSetValue: any = EMPTY_OBJ
let prevEmittedValue: any
watchSyncEffect(() => {
@ -51,7 +51,10 @@ export function useModel(
},
set(value) {
if (!hasChanged(value, localValue)) {
if (
!hasChanged(value, localValue) &&
!(prevSetValue !== EMPTY_OBJ && hasChanged(value, prevSetValue))
) {
return
}
const rawProps = i.vnode!.props