Skip to content

Commit 40f4b77

Browse files
authored
fix(v-model): avoid overwriting number input with same value (#7004)
close #7003
1 parent 94c049d commit 40f4b77

File tree

2 files changed

+67
-11
lines changed

2 files changed

+67
-11
lines changed

packages/runtime-dom/__tests__/directives/vModel.spec.ts

+55
Original file line numberDiff line numberDiff line change
@@ -101,6 +101,61 @@ describe('vModel', () => {
101101
expect(data.value).toEqual(1)
102102
})
103103

104+
// #7003
105+
it('should work with number input and be able to update rendering correctly', async () => {
106+
const setValue1 = function (this: any, value: any) {
107+
this.value1 = value
108+
}
109+
const setValue2 = function (this: any, value: any) {
110+
this.value2 = value
111+
}
112+
const component = defineComponent({
113+
data() {
114+
return { value1: 1.002, value2: 1.002 }
115+
},
116+
render() {
117+
return [
118+
withVModel(
119+
h('input', {
120+
id: 'input_num1',
121+
type: 'number',
122+
'onUpdate:modelValue': setValue1.bind(this)
123+
}),
124+
this.value1
125+
),
126+
withVModel(
127+
h('input', {
128+
id: 'input_num2',
129+
type: 'number',
130+
'onUpdate:modelValue': setValue2.bind(this)
131+
}),
132+
this.value2
133+
)
134+
]
135+
}
136+
})
137+
render(h(component), root)
138+
const data = root._vnode.component.data
139+
140+
const inputNum1 = root.querySelector('#input_num1')!
141+
expect(inputNum1.value).toBe('1.002')
142+
143+
const inputNum2 = root.querySelector('#input_num2')!
144+
expect(inputNum2.value).toBe('1.002')
145+
146+
inputNum1.value = '1.00'
147+
triggerEvent('input', inputNum1)
148+
await nextTick()
149+
expect(data.value1).toBe(1)
150+
151+
inputNum2.value = '1.00'
152+
triggerEvent('input', inputNum2)
153+
await nextTick()
154+
expect(data.value2).toBe(1)
155+
156+
expect(inputNum1.value).toBe('1.00')
157+
})
158+
104159
it('should work with multiple listeners', async () => {
105160
const spy = vi.fn()
106161
const component = defineComponent({

packages/runtime-dom/src/directives/vModel.ts

+12-11
Original file line numberDiff line numberDiff line change
@@ -83,24 +83,25 @@ export const vModelText: ModelDirective<
8383
el[assignKey] = getModelAssigner(vnode)
8484
// avoid clearing unresolved text. #2302
8585
if ((el as any).composing) return
86+
87+
const elValue =
88+
number || el.type === 'number' ? looseToNumber(el.value) : el.value
89+
const newValue = value == null ? '' : value
90+
91+
if (elValue === newValue) {
92+
return
93+
}
94+
8695
if (document.activeElement === el && el.type !== 'range') {
8796
if (lazy) {
8897
return
8998
}
90-
if (trim && el.value.trim() === value) {
91-
return
92-
}
93-
if (
94-
(number || el.type === 'number') &&
95-
looseToNumber(el.value) === value
96-
) {
99+
if (trim && el.value.trim() === newValue) {
97100
return
98101
}
99102
}
100-
const newValue = value == null ? '' : value
101-
if (el.value !== newValue) {
102-
el.value = newValue
103-
}
103+
104+
el.value = newValue
104105
}
105106
}
106107

0 commit comments

Comments
 (0)