>[success] # checked 多选单选使用 ~~~ 1.当点击多选的时候会先触发click 事件在触发v-model ~~~ >[danger] ##### html ~~~ <!--checkList 是一个数组,利用双向绑定会自动存在该数组中--> <input type="checkbox" v-model="checkList" v-bind:value="OpenID"> <a href="javascript:;" v-on:click="offchecked">取消选择</a> <!--全选--> <input type="checkbox" v-model="checked" v-on:click="checkedAll"> ~~~ >[danger] ##### data ~~~ checkList: [],// 单选框 checked: false,// 全选状态 ~~~ >[danger] ##### methods ~~~ // 取消所有checked 框 offchecked: function () { this.checkList = []; }, // 全选 框点击 checkedAll: function () { if (this.checked) { //实现反选 this.checkList = []; } else { this.checkList = []; for (var i = 0; i < this.fanList.length; i++) { this.checkList.push(this.fanList[i].OpenID); } } }, // 在watch 监听,当前选择框中的数据,是否等于所有数据,等于择全选框被选中 watch: { checkList(newVal, oldVal) { if (newVal.length == this.fanList.length) { this.checked = true } else { this.checked = false } }, }, ~~~