File tree Expand file tree Collapse file tree 2 files changed +54
-2
lines changed Expand file tree Collapse file tree 2 files changed +54
-2
lines changed Original file line number Diff line number Diff line change @@ -1306,4 +1306,56 @@ describe('vModel', () => {
1306
1306
1307
1307
expect ( inputNum1 . value ) . toBe ( '1' )
1308
1308
} )
1309
+
1310
+ // #10886
1311
+ it ( 'v-model.number should work with radio buttons' , async ( ) => {
1312
+ const component = defineComponent ( {
1313
+ data ( ) {
1314
+ return { value : null }
1315
+ } ,
1316
+ render ( ) {
1317
+ return [
1318
+ withVModel (
1319
+ h ( 'input' , {
1320
+ type : 'radio' ,
1321
+ class : 'one' ,
1322
+ value : '1' ,
1323
+ 'onUpdate:modelValue' : setValue . bind ( this ) ,
1324
+ } ) ,
1325
+ this . value ,
1326
+ {
1327
+ number : true ,
1328
+ } ,
1329
+ ) ,
1330
+ withVModel (
1331
+ h ( 'input' , {
1332
+ type : 'radio' ,
1333
+ class : 'two' ,
1334
+ value : '2.2' ,
1335
+ 'onUpdate:modelValue' : setValue . bind ( this ) ,
1336
+ } ) ,
1337
+ this . value ,
1338
+ {
1339
+ number : true ,
1340
+ } ,
1341
+ ) ,
1342
+ ]
1343
+ } ,
1344
+ } )
1345
+ render ( h ( component ) , root )
1346
+
1347
+ const one = root . querySelector ( '.one' )
1348
+ const two = root . querySelector ( '.two' )
1349
+ const data = root . _vnode . component . data
1350
+
1351
+ one . checked = true
1352
+ triggerEvent ( 'change' , one )
1353
+ await nextTick ( )
1354
+ expect ( data . value ) . toEqual ( 1 )
1355
+
1356
+ two . checked = true
1357
+ triggerEvent ( 'change' , two )
1358
+ await nextTick ( )
1359
+ expect ( data . value ) . toEqual ( 2.2 )
1360
+ } )
1309
1361
} )
Original file line number Diff line number Diff line change @@ -168,11 +168,11 @@ function setChecked(
168
168
}
169
169
170
170
export const vModelRadio : ModelDirective < HTMLInputElement > = {
171
- created ( el , { value } , vnode ) {
171
+ created ( el , { value, modifiers : { number } } , vnode ) {
172
172
el . checked = looseEqual ( value , vnode . props ! . value )
173
173
el [ assignKey ] = getModelAssigner ( vnode )
174
174
addEventListener ( el , 'change' , ( ) => {
175
- el [ assignKey ] ( getValue ( el ) )
175
+ el [ assignKey ] ( number ? looseToNumber ( getValue ( el ) ) : getValue ( el ) )
176
176
} )
177
177
} ,
178
178
beforeUpdate ( el , { value, oldValue } , vnode ) {
You can’t perform that action at this time.
0 commit comments