Stuck on an issue?

Lightrun Answers was designed to reduce the constant googling that comes with debugging 3rd party libraries. It collects links to all the places you might be looking at while hunting down a tough bug.

And, if you’re still stuck at the end, we’re happy to hop on a call to see how we can help out.

[Documentation] v-checkbox model is input-value, not value

See original GitHub issue

Environment

Vuetify Version: 2.4.3 Vue Version: 2.6.12 Browsers: Firefox 84.0 OS: Windows 10

Steps to reproduce

When using a v-checkbox with @change like

<v-checkbox :value="value" @change="(changed) => value = changed"></v-checkbox>

simply uncheck it after it was previously checked, and then look at the parameter that’s provided by the @change event, which is set to the value data variable. (Uncheck the second checkbox in the reproduction link.)

Expected Behavior

The value should become true when checked and false when unchecked. Alternatively there should be any documentation about the expected behavior. Additionally, the API documentation should most certainly document the expected behavior, along with the possible types (currently any) instead of an ambiguous “Emitted when the input is changed by user interaction”.

Actual Behavior

Uncheck the second checkbox in the reproduction link, and the value becomes null. Any strongly-typed code breaks a promise of returning a boolean.

Reproduction Link

https://codepen.io/cTAlENtATI/pen/dyObxzK

Issue Analytics

State:
Created 3 years ago
Reactions:1
Comments:8 (7 by maintainers)

Top GitHub Comments

2reactions

jacekkarczmarczykcommented, Jan 28, 2021

It’s :input-value, not :value

1reaction

xwiggencommented, Feb 23, 2021

v-simple-checkbox inside v-datatable issues Warning; failed to resolve directive: ripple (vue 2.6.11, vuetify 2.4.4)

Top Results From Across the Web

<input type="checkbox"> - HTML: HyperText Markup Language

Note: If a checkbox is unchecked when its form is submitted, there is no value submitted to the server to represent its unchecked...

Input type="checkbox" value=0 showing error (NULL)

But I want this that if the checkbox is not checked then the value should be 0, And it's showing perfectly in Inspect,...

HTML DOM Input Checkbox value Property - W3Schools

For checkboxes, the contents of the value property do not appear in the user interface. The value property only has meaning when submitting...

HTML | DOM Input Checkbox value Property - GeeksforGeeks

When the form is submitted by the user, the value and the other information sent to the server. But when the checkbox is...

Form Input Bindings - Vue.js

<input> with text types and <textarea> elements use value property and input event;; <input type="checkbox"> and <input type="radio"> use checked property and ...