vueでのckeckbox(チェックボックス)の使用、clickイベントとchangeの理解

1275 ワード

vueでのckeckbox(チェックボックス)の使用心得、clickイベントとchangeの理解イベントをクリックしてチェックボックスの状態を判断し、v-modelでcheckboxの値をバインドし、テキストとcssスタイルを変更します.
<div class="option">
				<input type="checkbox" name="" @change="checkclick(mytype)" v-model="checkVal"> 
        

@click:clickイベントをv-onコマンドで傍受し、トリガ時にconsoleを実行できます.log(that.ckeckVal); change:v-on命令でchangeイベントを傍受し、状態が変化した後にconsoleを実行することができる.log(that.ckeckVal); clickイベントのトリガはクリックされた瞬間であり,changeイベントは状態が変化した後にトリガされる.
この言葉をよく読むと、トリガ時、つまり上のコードのclickMeの実行時間はクリックした瞬間であり、クリックした瞬間ではないことがわかります.クリックした瞬間のチェックボックスの値も確かに`falseであり、私たちが得た結果がfalseである理由を説明しています.この点が分かったら@clickを@changeに変更し、チェックボックスをクリックすると次の結果が得られます.