vueでのchecked結合v-model

3204 ワード

vueのtodolistを復習してcheckedを記録してv-modelと結合して印象を深めました
<p>   </p>
<ul id="ul1">
	<li v-if="!item.pd" v-for="item in list">
		<input type="checkbox" v-model="item.pd">{{item.text}}
	</li>
</ul>
data(){
	return{
		list:[
			{text:'  ',pd:false},
			{text:'  ',pd:false},
			{text:'  ',pd:true},
		]
	}
}

ユーザーがクリックしてcheckboxの選択と選択されていない状態を変更すると、v-modelによってdataの下のpd属性の値がリアルタイムで変更されます.