Erreur ne pas modifier la case à cocher Vuelidate

Question

Je suis en train d'essayer la validation et j'ai un problème car je veux vérifier si la case à cocher a été cochée. $error il ne soumettra pas le formulaire. Lors de la sortie du $v, j'obtiens ce qui suit, mais cela ne change pas lorsque je clique. En fait, j'ai un gros formulaire et s'il a $error à true, il ne se soumettra pas. Je veux ajouter $error à cocher également. Code ici

"form": {
    "checkbox": {
      "required": true,
      "$model": false,
      "$invalid": false,
      "$dirty": true,
      "$anyDirty": true,
      "$error": false,
      "$anyError": false,
      "$pending": false,
      "$params": {
        "required": {
          "type": "required"
        }
      }
    }

Answer 1

Avec une case à cocher, vous devez utiliser sameAs

  validations: {
    form: {
      checkbox: {
        sameAs: sameAs( () => true )
      }
    }
  }

Answer 2

Vous devez créer un validateur personnalisé comme celui-ci.

data(){
  checkbox_items: [],
  options: [
    { id: 1, label: 'label1' }
    { id: 2, label: 'label2' }
    { id: 3, label: 'label3' }
  ]
},
validations: {
  checkbox_items: {
    checked: value => {
      return value.length
    }
  }
}

Modèle :

<div v-for="item in options" :key="item.id">
  <input type="checkbox"
    :id="'item.id"
    :class="{ error: $v.checkbox_items.$error }"
    :value="item.id"
    v-model="checkbox_items"
    @blur="$v.checkbox_items.$touch()">
  <label :for="'item.id">{{ item.label }}</label>
</div>