Vue: checking both v-model and v-bind:value used on same element conflicts with customizing component v-model

[VdustR]

Version

2.5.5

Reproduction link

https://github.com/VdustR/vue-issue-7084

Steps to reproduce

# install dependencies
npm install

# serve with hot reload at localhost:8080
npm run dev

What is expected?

Compiled successfully.

What is actually happening?

Got error:

 - :value conflicts with v-model on the same element because the latter already expands to a value binding internally

---

The new improvements from v2.5.5

warn if both v-model and v-bind:value are used on same element

conflicts with Customizing Component v-model.

Downgrade the vue(vue-template-compiler exactly) in the reproduction to 2.5.4 and it will be compiled successfully.

BTW,
Production vue.js works fine -> CodePen

[davi5e]

+1

[alex-malyita]

The same error, version 2.5.6

[yyx990803]

@alex-malyita note the warning should appear if you use both :value and v-model on the same <input type="text"> element; the fix only removed the warning for custom components.

[kamalakarchagam]

same error for the following snippet to create group radio boxes
<input type="radio" v-for="currency in currencies" name="booking_currencies" class="custom-control-input" v-model="currencySelected" :value="currency">

[yyx990803]

@chagamkamalakar make sure to update to latest version.

[kamalakarchagam]

@yyx990803 .. the error still there .. current version [email protected]

[yyx990803]

@chagamkamalakar then please open a separate issue with a proper reproduction.

[RoamIn]

+1

[kamalakarchagam]

@yyx990803 ... this error not coming up in new setup ... but coming up only in existing project...

please any help?

[kamalakarchagam]

this error is gone now.... deleted node_moduels folder .. run npm install again ... it's gone now.

[kamalakarchagam]

but i could see one problem now ...for custom components watcher for value props not getting called initially, but gets called when emitted from custom component ..

[jules2m1998]

` name="transport_mode"
v-for="(check, key) in checks"
:value="check.name"
:checked="check.value"
style="display: none"
/>
v-for="(check, key) in checks"
:key="key"
:label="check.name"
v-model="check.value"

` try that