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

feat(vModel): handle true-value and false-value #449

Merged
merged 2 commits into from Nov 12, 2019

Conversation

cexbrayat
Copy link
Member

I noticed that the current v-model does not handle true-value and false-value for checkboxes as we had in Vue 2.x.

This is a rough attempt to implement it, just to start a discussion.
Is this a feature you plan to keep in v3? If so, does this look the right way to handle it?

Copy link
Member

@posva posva left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Aren't we missing passing objects to true-value and false-value? If we get through HTML attributes, we can only have strings, no numbers, no objects

@yyx990803
Copy link
Member

yyx990803 commented Nov 11, 2019

Good catch! As @posva noted, we also need to handle e.g. :true-value="someObject" so we need to force set true-value and false-value as DOM properties on <input> elements - which means we will need a special case for that here.

Then in vModel.ts we will need a helper like this:

function getCheckboxValue(el, checked) {
  const key = checked ? 'true-value' : 'false-value'
  return key in el ? el[key] : checked
}

Allows to use:

    <input type="checkbox" :true-value="someObject" false-value="no">

Handles a special case in `patchProp` to store the object values and be able to access them in `vModel`.
@cexbrayat
Copy link
Member Author

@posva @yyx990803 Thanks for the feedback!

I added a unit test and implemented a special case in patchProp, let me know if this how you intended it.

@yyx990803 yyx990803 merged commit fe66194 into vuejs:master Nov 12, 2019
@vue-bot
Copy link

vue-bot commented Nov 12, 2019

Hey @cexbrayat, thank you for your time and effort spent on this PR, contributions like yours help make Vue better for everyone. Cheers! 💚

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

Successfully merging this pull request may close these issues.

None yet

4 participants