vue点击切换选中和不选中,vue的点击菜单切换界面
本文主要介绍vue实现点击选择取消切换，有很好的参考价值，希望对大家有所帮助。如有错误或不足之处，请不吝赐教。
目录
vue点击选择取消切换vue点击选择，再次点击取消举个栗子。
vue点击选中取消切换
超文本标记语言
El-button @ click= searchstatistics info(item):class= item . is choose==true？active : size= small v-for=(item，index)in menulist :key= index { { item . name } }/El-button
数据
菜单列表：[{
id: 1，
isChoose:没错，
名称：“今天”
}, {
id: 2，
isChoose:假，
名称：“过去七天”
}, {
id: 3，
isChoose:假，
名称：“最近30天”
}, {
id: 4，
isChoose:假，
名称：“最近90天”
}],
射流研究…
方法：{
searchStatisticsInfo (item) {
for (let item of this.menulist) {
item.isChoose=false
}
item.isChoose=！item . is choose；
}
}
如果数组不包含isChoose，则需要将其更改为$set。
searchStatisticsInfo (item) {
for (let row of this.menulist) {
这个。$set(row， isChoose ，false)；
}
这个。$set(item， isChoose ，true)；
},
vue点击选中，再次点击取消
举个栗子
在el-calendar中单击选中它，然后再次单击取消选中它。
你可以定义一个变量，用它的值作为判断。如果它等于点击日期，它将被取消选中。
//点击查询当天的记录。
handleHoliday(日期，数据){
const { day }=data
if(this . clickTime===day){///定义变量clickTime
this . find worklist(this . current date)；
this . find list(this . current date)；
this . click time=“”；//如果值再次为空，可以继续点击。
返回；
}否则{
this.clickTime=day//日期不能用于比较。日期是一个变化的值。
this . find worklist(this . current date，day)；
this.findList(this.currentDate，day)
}
}
},
以上个人经历，希望能给大家一个参考，也希望大家多多支持我们。
郑重声明：本文由网友发布，不代表盛行IT的观点，版权归原作者所有，仅为传播更多信息之目的，如有侵权请联系，我们将第一时间修改或删除，多谢。