vue实现checked 全选功能

记录一下

 

module.data = {

 result: {}, items: []
//初始化全选按钮, 默认不选
,isCheckedAll: false
};
module.vue = new Vue({
el: moduleId,
data: module.data,
methods: {

CheckItem: function (item) {

 console.log(item);//true
            let idIndex = this.items.indexOf(item) if (idIndex >= 0) { // 如果已经包含了该id, 则去除(单选按钮由选中变为非选中状态)
                this.items.splice(idIndex, 1) } else { // 选中该checkbox
                this.items.push(item) } console.log(this.items); }, CheckAll: function () { console.log(module.data.result.Data); this.isCheckedAll = !this.isCheckedAll if (this.isCheckedAll) { // 全选时
                this.items = [] this.result.Data.forEach(function (x) { this.items.push(x.Id) }, this) } else { this.items = [] } console.log(this.items); }

}
});

<input type="checkbox" id="qx" v-on:click="CheckAll()" />全选

<input type="checkbox" name="ck" v-on:click="CheckItem(x.Id)" :checked="items.indexOf(x.Id)>=0" :value="x.Id" />