思路 ： 但勾选全选时，使用map遍历，$set来更改数组中的勾选状态，取消也同理,

使用every方法来判断是否是都勾选（true）或者取消勾选(false)  效果如图:

    <p><input type="checkbox" v-model="checkAll" @change="checkAllBox" /><label for="all">全选</label></p><p v-for="(item,index) in checkBoxArr" :key="index"><input type="checkbox" v-model="item.check" @change="checkInput" /><label :for="item.name">{{item.name}}</label></p>

<script>
export default {name: "HelloWorld",props: {msg: String},data() {return {checkAll: false,checkBoxArr: [{id: 0,name: "check1",check: false},{id: 1,name: "check2",check: false},{id: 2,name: "check3",check: false},{id: 3,name: "check4",check: false}]};},methods: {//全选checkAllBox(e) {e.target.checked ? this.checkBoxArr.map(val => this.$set(val, "check", true)) : this.checkBoxArr.map(val => this.$set(val, "check", false));},checkInput() {this.checkAll = this.checkBoxArr.every(val=>val.check) ? true :false;}}
};