I use the favorites list looped out by v-for. If I want to click on the hearts area of a favorites list, the favorites list will be hidden and removed. But every time I click on one of them, the looped list is all hidden. The code is as follows:
html section:
<div class="body_body" v-show="favShow" v-for="(temp, index) in temp" :key="index">
<div class="body_body_left" @click="chooseThis(temp.coachId)">
<img class="body_body_left_img" :src=temp.avatar>
</div>
<div class="body_body_center" @click="chooseThis(temp.coachId)">
<span class="body_body_center_text1">{{temp.name}}({{temp.schoolName}})</span>
<span class="body_body_center_text2">{{temp.experience}} | {{temp.score}}</span>
</div>
<div class="body_body_right">
<img class="body_body_right_img" src="../../assets/MyFavorite/xysc@2x.png" @click="removeFav(index)">
</div>
</div>
javascript section:
removeFav(data) {
let vm = this;
vm.favShow = false;
for (const v of vm.temp) {
if (data == vm.temp.indexOf(v)) {
vm.id = v.id;
}
console.log(vm.id);
}
removeFavorite(vm.id).then(response => {
const data = response.data;
if ((data.code = constants.status_success)) {
vm.showToast = true;
vm.toastTitle = "!";
vm.toastType = "text";
vm.toastWidth = "200px";
} else {
vm.showToast = true;
vm.toastTitle = data.message;
vm.toastType = "text";
vm.toastWidth = "200px";
}
});
},