全选按钮
<th style="width:5%;text-align: center">
全选
<input type="checkbox" @click="checkAll($event)" name="" id="selectAll">
</th>
单选按钮
<td class="fatherTd">
<input type="checkbox" class="checkItem" v-model='item.flag'@click='checkItems($event)'/>
</td>
js
//点击全选
checkAll(e) {
var checkObj = document.querySelectorAll(".checkItem");
if (e.target.checked) {
for (let i = 0; i < checkObj.length; i++) {
checkObj[i].checked = true;
}
for (var x in this.siylist) {
this.siylist[x].flag = true;
}
} else {
for (let i = 0; i < checkObj.length; i++) {
checkObj[i].checked = false;
}
for (var x in this.siylist) {
this.siylist[x].flag = false;
}
}
},
//二级选择框
checkItems(e) {
var checkObj = document.querySelectorAll(".checkItem");
var checkAll = document.getElementById("selectAll");
if (e.target.checked) {
var flagt = true;
for (var m = 0; m < checkObj.length; m++) {
if (!checkObj[m].checked) {
flagt = false;
}
}
if (flagt) {
checkAll.checked = true;
}
} else {
var flagf = true;
for (var n = 0; n < checkObj.length; n++) {
if (checkObj[n].checked) {
flagf = false;
}
}
if (!flagf) {
checkAll.checked = false;
}
}
},