Any super simple two-way binding checkbox input examples using useField?

[rwfresh]

Hi all,

I'm looking for some reference, guidance for a super simple checkbox input example. I'm having problems with binding either checked or value from useField to the actual input. The value.value and checked.value never seem to update.

....

const { checked, errors, meta } = useField("myCheckboxInput", "required:true", { initialValue: props.modelValue, label: "my label", type: "checkbox" });

When the checkbox is clicked checked.value is not updated? I've tried the same using value from the hook, no luck. I've also tried binding props.modelValue? thanks!

[logaretm]

Did you check this example?. Generally checkbox boxes have two values:

• The value to set when they are checked which is commonly referred to as value or checkedValue but never modelValue.
• The current group value for the checkbox (even if single one), this is referred to as modelValue in most vue implementations.

vee-validate follows those conventions however it could get confusing. Do you have a sample for your code where you can't get it to work? put it in a sandbox and I can help. Otherwise the example should guide you towards getting it to work.

[rwfresh]

Hi @logaretm, thanks for the quick reply. Right now in my custom checkbox component I am having to update the modelValue in a change/click/input handler using handleChange(newVal). If I bind a ref to the input's v-model would you expect the ref.value to be updated when the checkbox is clicked?? without having to call handleChange? I will try and post an example as soon as I get a chance. My example is a single checkbox with true (checkedValue)/ false (uncheckedValue). I want to bind my local ref to the modelValue and avoid having to use handleChange. Thanks!