fix(runtime-dom): force update v-model number with leading 0 (#10506)

close #10503
close #10615

diff --git a/packages/runtime-dom/__tests__/directives/vModel.spec.ts b/packages/runtime-dom/__tests__/directives/vModel.spec.ts
index d6398f37321bfc9c00619c42ebe856c73ad380de..66b57b68964b916ddbf218e31a120e618afbfd5f 100644 (file)
--- a/packages/runtime-dom/__tests__/directives/vModel.spec.ts
+++ b/packages/runtime-dom/__tests__/directives/vModel.spec.ts
@@ -1269,4 +1269,41 @@ describe('vModel', () => {
     expect(foo.selected).toEqual(true)
     expect(bar.selected).toEqual(true)
   })
+
+  // #10503
+  test('equal value with a leading 0 should trigger update.', async () => {
+    const setNum = function (this: any, value: any) {
+      this.num = value
+    }
+    const component = defineComponent({
+      data() {
+        return { num: 0 }
+      },
+      render() {
+        return [
+          withVModel(
+            h('input', {
+              id: 'input_num1',
+              type: 'number',
+              'onUpdate:modelValue': setNum.bind(this),
+            }),
+            this.num,
+          ),
+        ]
+      },
+    })
+
+    render(h(component), root)
+    const data = root._vnode.component.data
+
+    const inputNum1 = root.querySelector('#input_num1')!
+    expect(inputNum1.value).toBe('0')
+
+    inputNum1.value = '01'
+    triggerEvent('input', inputNum1)
+    await nextTick()
+    expect(data.num).toBe(1)
+
+    expect(inputNum1.value).toBe('1')
+  })
 })

diff --git a/packages/runtime-dom/src/directives/vModel.ts b/packages/runtime-dom/src/directives/vModel.ts
index e002e2e10dac6ad650ea773135bab8dbef031392..b0ea41728bd08443a53d12139e2d0a3b70cdcac0 100644 (file)
--- a/packages/runtime-dom/src/directives/vModel.ts
+++ b/packages/runtime-dom/src/directives/vModel.ts
@@ -86,9 +86,10 @@ export const vModelText: ModelDirective<
     el[assignKey] = getModelAssigner(vnode)
     // avoid clearing unresolved text. #2302
     if ((el as any).composing) return
-
     const elValue =
-      number || el.type === 'number' ? looseToNumber(el.value) : el.value
+      (number || el.type === 'number') && !/^0\d/.test(el.value)
+        ? looseToNumber(el.value)
+        : el.value
     const newValue = value == null ? '' : value
 
     if (elValue === newValue) {