vue v-for出来的列表,点击某个li使得当前被点击的li字体变红操作

这里使用的是给被点击的li添加类名的方式

 li{
  list-style: none;
 }
 .red{
  color: red;
 }

如果想要获取lists里某条数据信息的话，直接将item传递过去即可（@click=“clickAdd(item)”）

补充知识：vue点击ul中的li显示，点击其他地方隐藏

vue点击ul中的li显示弹框，点击其他地方隐藏弹框

注意：ref="seatTipOperation"

 
添加
 
删除
 
锁定
 
插空
 
插座
 
对调

handleSeatList () {
 this.seatTipOperationVisible = true
}

mounted () {
 // this的指向问题
 let that = this
 document.addEventListener('click', function (e) {
  // 这里that代表组件，this代表document
  // 冒泡也不会隐藏
  if(!that.$refs.seatTipOperation.contains(e.target)){
   that.seatTipOperationVisible = false
  }
 })
}

以上这篇vue v-for出来的列表,点击某个li使得当前被点击的li字体变红操作就是小编分享给大家的全部内容了，希望能给大家一个参考，也希望大家多多支持考高分网。