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

…11430) close #11429
vuejs · Jul 24, 2024 · a18f1ec · a18f1ec
1 parent 422ef34
commit a18f1ec
Show file tree

Hide file tree

Showing 2 changed files with 20 additions and 12 deletions.
diff --git a/packages/runtime-core/__tests__/helpers/useModel.spec.ts b/packages/runtime-core/__tests__/helpers/useModel.spec.ts
@@ -614,32 +614,31 @@ 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 () =>
           h(Comp, {
             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)
   })
 })
diff --git a/packages/runtime-core/src/helpers/useModel.ts b/packages/runtime-core/src/helpers/useModel.ts
@@ -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