checkboxを並べて、それが3つほどで収まっている場合は、それだけでもいいでしょう。 しかし、ユーザーが自身で追加した項目など、何個出力されるか分からない場合があります。 ここではそんな時にあると便利な「すべて選択」を実装してみます。 実装デモ See the Pen Select All Checkbox by Vue.js - flow4 by Shoko Oyamada (@chcltn) on CodePen. 「すべて選択」の実装の流れ dataとv-forでリストを用意 すべて選択が押されたかのフラグを用意 すべて選択が押された時の動きを作成 個々のcheckboxをクリックした時の動きを作成 1.dataとv-forでリストを用意 dataにて、猫の名前を配列catsに入れておきます。 それを利用し、v-forでリストを作成します。 See the Pen Select