vue中实现多个弹窗,单一的点击关闭

<div class="payment_box"  v-for="(item,index) in bannerList8" :key="item.id" v-show="pay_isclose.indexOf(index) == -1">
      <div class="pay_box" >
        <div class="close" @click="close(index)">×</div>
        <img :src="item.ad_code" alt="">
        <a class="pay_link" @click="pay_link(index,item.ad_link)"></a>
        <span><i @click="pay_btn"><img src="../../../static/images/Path 81.png" alt="" style="width: 12px;height: 12px;"  v-show="remind_img"></i>不再提醒</span>
      </div>
    </div>

v-show="pay_isclose.indexOf(index) == -1" 通过此函数判断检测是否存在这个index

close(num_index) { 
		this.pay_isclose.push(num_index);
		 localStorage.setItem('pay_isclose',JSON.stringify(this.pay_isclose));
 }

将点击触发哪一个然后把值赋进去,将数组转成字符串,方便把各个值带到数组中

pay_close() {
        var pay_isclose = sessionStorage.getItem('pay_isclose');
        if(pay_isclose)  this.pay_isclose = JSON.parse(pay_isclose);
 }

在将字符串转成数组的形式,存到cook

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值