Vue框架中,對于復選框的選擇狀態,可以通過v-model實現雙向綁定,也可以通過v-bind綁定屬性實現單向綁定,但是這種綁定方式不能夠觸發選擇狀態的改變事件。
// 單向綁定// 雙向綁定
如果需要監聽復選框的狀態更改事件,那么需要使用v-on:change或者@change事件,當用戶選擇或取消選擇時,會觸發change事件并執行相應的操作。
new Vue({
el: '#app',
data: {
isChecked: false
},
methods: {
handleCheckChange: function () {
if (this.isChecked) {
console.log('已選擇');
} else {
console.log('已取消選擇');
}
}
}
})
在模板中,可以通過v-on:change或者@change綁定復選框的狀態更改事件,當復選框的狀態發生更改時,會自動調用methods中定義的handleCheckChange方法,并在控制臺輸出相應的信息。
上一篇html應用區塊設置元素
下一篇vue實現小球彈入