From 70d8092d217450ef682c84210359728258399166 Mon Sep 17 00:00:00 2001
From: Jelf <353742991@qq.com>
Date: Fri, 6 May 2022 00:55:54 +0800
Subject: [PATCH] fix(useVModel): unified value (#1568)

---
 packages/core/useVModel/index.test.ts | 36 +++++++++++++++++++++------
 packages/core/useVModel/index.ts      |  6 +++--
 2 files changed, 33 insertions(+), 9 deletions(-)

diff --git a/packages/core/useVModel/index.test.ts b/packages/core/useVModel/index.test.ts
index 1b26fa71a77..013af82ca47 100644
--- a/packages/core/useVModel/index.test.ts
+++ b/packages/core/useVModel/index.test.ts
@@ -105,32 +105,54 @@ describe('useVModel', () => {
   })
 
   it('should work with user define defaultValue', () => {
-    const props = {
+    const props: Record<string, unknown> = {
       ...defaultProps(),
-      data: undefined as string | undefined,
       a: 0,
       b: '',
       c: false,
+      d: null,
+      e: undefined,
     }
     const emitMock = vitest.fn()
 
     const data = useVModel(props, 'data', emitMock, { defaultValue: 'default-data' })
-    const dataA = useVModel(props, 'a', emitMock)
-    const dataB = useVModel(props, 'b', emitMock)
-    const dataC = useVModel(props, 'c', emitMock)
+    const dataA = useVModel(props, 'a', emitMock, { defaultValue: 'default-data' })
+    const dataB = useVModel(props, 'b', emitMock, { defaultValue: 'default-data' })
+    const dataC = useVModel(props, 'c', emitMock, { defaultValue: 'default-data' })
+    const dataD = useVModel(props, 'd', emitMock, { defaultValue: 'default-data' })
+    const dataE = useVModel(props, 'e', emitMock, { defaultValue: 'default-data' })
 
     expect(data.value).toBe('default-data')
     expect(dataA.value).toBe(0)
     expect(dataB.value).toBe('')
     expect(dataC.value).toBe(false)
+    expect(dataD.value).toBe(null)
+    expect(dataE.value).toBe('default-data')
   })
 
   it('should work with user define defaultValue with passive', () => {
-    const props = {
+    const props: Record<string, unknown> = {
       ...defaultProps(),
+      a: 0,
+      b: '',
+      c: false,
+      d: null as string | null,
+      e: undefined as string | undefined,
     }
     const emitMock = vitest.fn()
-    const data = useVModel(props, 'data', emitMock, { passive: true, defaultValue: 'default-data' })
+
+    const data = useVModel(props, 'data', emitMock, { defaultValue: 'default-data', passive: true })
+    const dataA = useVModel(props, 'a', emitMock, { defaultValue: 'default-data', passive: true })
+    const dataB = useVModel(props, 'b', emitMock, { defaultValue: 'default-data', passive: true })
+    const dataC = useVModel(props, 'c', emitMock, { defaultValue: 'default-data', passive: true })
+    const dataD = useVModel(props, 'd', emitMock, { defaultValue: 'default-data', passive: true })
+    const dataE = useVModel(props, 'e', emitMock, { defaultValue: 'default-data', passive: true })
+
     expect(data.value).toBe('default-data')
+    expect(dataA.value).toBe(0)
+    expect(dataB.value).toBe('')
+    expect(dataC.value).toBe(false)
+    expect(dataD.value).toBe(null)
+    expect(dataE.value).toBe('default-data')
   })
 })
diff --git a/packages/core/useVModel/index.ts b/packages/core/useVModel/index.ts
index 8f1cabb213e..cbb00c55641 100644
--- a/packages/core/useVModel/index.ts
+++ b/packages/core/useVModel/index.ts
@@ -70,8 +70,10 @@ export function useVModel<P extends object, K extends keyof P, Name extends stri
 
   event = eventName || event || `update:${key}`
 
+  const getValue = () => isDef(props[key!]) ? props[key!] : defaultValue
+
   if (passive) {
-    const proxy = ref<P[K]>(props[key!] ?? defaultValue!)
+    const proxy = ref<P[K]>(getValue()!)
 
     watch(() => props[key!], v => proxy.value = v as UnwrapRef<P[K]>)
 
@@ -87,7 +89,7 @@ export function useVModel<P extends object, K extends keyof P, Name extends stri
   else {
     return computed<P[K]>({
       get() {
-        return isDef(props[key!]) ? props[key!] : defaultValue!
+        return getValue()!
       },
       set(value) {
         _emit(event, value)