Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

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

Closed
VdustR opened this issue Nov 18, 2017 · 12 comments

Comments

@VdustR
Copy link

VdustR commented Nov 18, 2017

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

@VdustR VdustR changed the title checking both v-model and v-bind:value used on same element is conflict with customizing component v-model checking both v-model and v-bind:value used on same element is conflicted with customizing component v-model Nov 18, 2017
@VdustR VdustR changed the title checking both v-model and v-bind:value used on same element is conflicted with customizing component v-model checking both v-model and v-bind:value used on same element conflicts with customizing component v-model Nov 18, 2017
@davi5e
Copy link

davi5e commented Nov 18, 2017

+1

@alex-malyita
Copy link

The same error, version 2.5.6

@yyx990803
Copy link
Member

@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
Copy link

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
Copy link
Member

@chagamkamalakar make sure to update to latest version.

@kamal-chagam
Copy link

kamal-chagam commented Nov 21, 2017

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

@yyx990803
Copy link
Member

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

@Roamin
Copy link

Roamin commented Nov 22, 2017

+1

@kamal-chagam
Copy link

kamal-chagam commented Nov 22, 2017

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

please any help?

@kamal-chagam
Copy link

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

@kamal-chagam
Copy link

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
Copy link

<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

aJean pushed a commit to aJean/vue that referenced this issue Aug 19, 2020
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

7 participants