vue computed checked多选单选

vue 使用 computed 快速创建checkbox

// 单个选项
<li v-for="(item, index) in tList" :key="index" :class="{ active: item.checked }" @click="checkToggle(item, index)">
        <span><input type="checkbox" v-model="item.checked"/></span> 
 </li>
 // 全选按钮
 <label for="all"><input type="checkbox" name="" id="all" v-model="checkAll" />全选</label>
     
     data(){
     return {
     	ticketList: [
     		{
     		...,
     		...,
     		checked : false
     		}
     	],
     	selectedList :[]// 选中的
     }
    watch: {
    checkAll: {
      handler(val) {
        console.log(val, "watch");
        this.selectedList = [];
        if (val) {
          this.selectedList = this.ticketList;
        } else {
          this.selectedList = this.ticketList.filter(item => item.checked);
        }

        console.log(this.selectedList, "watch");
      },
      deep: true
    }
   }，
   computed: {
    checkAll: {
      get: function() {
        return this.ticketList.reduce(function(prev, curr) {
          return prev && curr.checked;
        }, true);
      },
      set: function(newValue) {
        this.ticketList.forEach(function(item) {
          item.checked = newValue;
        });
      }
    }
  },
  methods: {
    checkToggle(row) {
      row.checked = !row.checked;
    }
  }