グーグルで検索して、知っているあらゆる組み合わせを試してみましたが、チェックボックスをチェック済みの状態で初期化することができません。
例:
<ul class="object administrator-checkbox-list">
<li v-for="module in modules">
<label v-bind:for="module.id">
<input type="checkbox" v-model="form.modules" v-bind:value="module.id" v-bind:id="module.id">
<span>@{{ module.name }}</span>
</label>
</li>
</ul>
モジュールデータの例:
[
{
"id": 1,
"name": "Business",
"checked": true
},
{
"id": 2,
"name": "Business 2",
"checked": false
},
]
チェックボックスのチェック状態を最初に設定するにはどうすればよいですか?
ベストアンサー1
チェックボックスの状態を設定するには、v-model を値にバインドする必要があります。値が真の場合、チェックボックスがオンになります。この場合、反復処理が行われmodules
、それぞれにプロパティmodule
がありますchecked
。
次のコードは、チェックボックスをそのプロパティにバインドします。
<input type="checkbox" v-model="module.checked" v-bind:id="module.id">
この状況でv-modelがどのように機能するかについて詳しく知りたい場合は、次のリンクを参照してください。フォーム入力バインディングに関するドキュメント。