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.

[kamal-chagam]

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.

[kamal-chagam]

@yyx990803 .. the error still there .. current version vue@2.5.8

[yyx990803]

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

[Roamin]

+1

[kamal-chagam]

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

please any help?

[kamal-chagam]

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

[kamal-chagam]

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]

<input type="checkbox" name="transport_mode" v-for="(check, key) in checks" :value="check.name" :checked="check.value" style="display: none" /> <v-checkbox v-for="(check, key) in checks" :key="key" :label="check.name" v-model="check.value" ></v-checkbox> try that