2020-10-14

---

前言

VUE优惠券 ， 购物车 ， 退款原因 单选取消

---

提示：以下是本篇文章正文内容，下面案例可供参考

一、问题是什么？

只选择一个 当选择其他的时 ，该选择取消，选中新的 。选中的再次点击时取消选中

二、步骤

1.想法

代码如下（示例）：

首先
 arr:[{'id':"1",'title':"未发货"},{'id':"2",'title':"拍错了"},{'id':'3','title':"不想要了"}]
一个这样的数组
给数组中的每一项添加一个变量 isClick 为 false
实现方法
for (const v in this.arr) {
	this.$set(this.arr[v], "isClick", false)
}
然后在上方的html中改变v-if的判断方式
<image v-if="item.isClick=== false" src="../../static/images/son_0018_right2.png" mode=""></image>
<image v-else src="../../static/images/son_0019_right1.png" mode=""></image>

2.当点击时

将index下标传入函数中
进行判断
如果这个已经被选中的话  点击会将这个字段的isClick变为相反的
如果没被选中的话，现将所有的变为false然后在进行isClick的判断
setClick(id,index){
	for (const i in this.arr){  
		if(this.arr[index].isClick == true){
			this.arr[index].isClick = !this.arr[index].isClick
			
		}else{
			for (const v in this.arr) {
				this.$set(this.arr[v], "isClick", false)
			}
			this.arr[index].isClick =!this.arr[index].isClick
		}
	}
	console.log(this.arr)
}

该处使用的url网络请求的数据。

---

总结

应该有很多的方法 本人比较小白 ，望大神 给点别的方法