[Vuejs]-Vuejs is using a modified event directive without an event handler OK?

0👍

Is it bad? Well, yes and no. As far as I can tell, your input remains accessible through the keyboard (even if screenreaders cannot find any information on what that checkbox may be) and your model remains reactive.

That said, you are reinventing the wheel. A label html element links a form field with a description. It also catches clicks, and depending on the type of form field, focuses the form field, toggles it or opens a file dialog. You should really be using that instead of your own implementation.

<li v-for="datum in data">
  <label>
    <span class="screen-reader">{{ datum.name }}</span>
    <input type="checkbox" v-model="datum.checked" :value="datum.name">
  </label>
</li>

Leave a comment