1 <ul class="cart-list" v-for="sku in skuInfo" :key="sku.id">
2 <li class="cart-list-con1">
3 <input
4 type="checkbox"
5 name="chk_list"
6 :checked="sku.todo"
7 @click="isCheckbox(sku)"
8 />
9 </li>
10 </ul>
11
12 <div class="select-all">
13 <input class="chooseAll" type="checkbox" v-model="Check" />
14 <span>全选</span>
15 </div>
16
17
18 <script>
19 export default {
20 data() {
21 return {
22 skuInfo: [],
23 isCheck: false,
24 };
25 },
26 computed: {
27 Check: {
28 get() {
29 // console.log("get")
30 return this.isCheck;
31 },
32 set() {
33 // console.log("set")
34 this.isCheck = !this.isCheck;
35 this.skuInfo.forEach((sku) => {
36 if (this.isCheck) {
37 sku.todo = true;39 } else {
40 sku.todo = false;42 }
43 });
44 },
45 },
46 },
47 mounted() {
48 this.getShopCart();
49 },
50 methods: {
51 getShopCart() {
52 reqCartList()
53 .then((res) => {
54 if (res.code == "200") {
55 this.skuInfo = res.data
56 } else {
57 alert(res.message);
58 }
59 })
60 .catch((err) => {
61 console.log("系统繁忙！请重试");
62 });
63 },
64 isCheckbox(sku) {
65 if (!sku.hasOwnProperty("todo")) {
66 sku.todo = true;
67 } else {
68 sku.todo == true ? (sku.todo = false) : (sku.todo = true);
69 }
70 if (sku.todo) {
71 let index = this.skuInfo.filter((res) => res.todo == true);
72 if (index.length == this.skuInfo.length) {
73 this.isCheck = true;
74 }
75 } else {
76 this.isCheck = false;
77 }
78 },
79
80 },
81 };
82 </script>
