problem description
two buttons that control the selection of all (select all 5 and select all 4). The on class name is added only if you click it. Because the events bound in the code are the same, both buttons add the class name
after clicking.the environmental background of the problems and what methods you have tried
try to use a different index, to add a class only if it is equal to index, but it is difficult to control later. You need to click on another item. Remove the on from the Select all button
related codes
/ / Please paste the code text below (do not replace the code with pictures)
< button @ click= "checkAllClick (5)": class= "{on: clicked}" > all 5 < / button >
< button @ click= "checkAllClick (4)": class= "{on: clicked}" > all 4 < / button >
new Vue ({
el: "-sharpapp",
data: {
clicked: false,
inputArr: []
},
mounted: function(){
var inputArray = document.querySelectorAll(".check-div input");
this.inputArr = inputArray;
},
methods: {
checkAllClick: function(num) {
if(this.clicked) return;
this.clicked = true;
for (var i = 0; i < this.inputArr.length; iPP) {
var text = this.inputArr[i].nextSibling.nextSibling.innerText;
if (text == num) {
this.inputArr[i].checked = true;
}
}
},
radioChangeClick: function() {
if(this.clicked){
this.clicked = false;
}
}
}
})what result do you expect? What is the error message actually seen?
