Vue@click记录一种出错

最新推荐文章于 2024-01-31 11:01:48 发布

赢涟涟

最新推荐文章于 2024-01-31 11:01:48 发布

阅读量2.2k

点赞数 2

分类专栏： vue 文章标签：前端 css vue.js 1024程序员节

本文链接：https://blog.csdn.net/m0_47084256/article/details/120943205

版权

vue 专栏收录该内容

1 篇文章 0 订阅

订阅专栏

本文讨论了一个现象，即在HTML中，两个子项的@click事件绑定到同一级父元素，但只有其中一个响应。经分析发现原因是.bgbg_aq的z-index值过低。解决方法在于调整相关CSS样式，提升该元素的层级。

摘要由CSDN通过智能技术生成

问题：@click事件绑定在1和2的父级盒子上，但是点击2盒子有效，点击1盒子无效
在这里插入图片描述

代码：

  <div class="itemlist">
      <div class="item" @click="toSecurity()">
        <div class="bg bg_aq">
          <div class="iconfont icon-anquan icon2"></div>
        </div>
        <div class="text">安全常识</div>
      </div>

      <div class="item" @click="toLaw">
        <div class="bg bg_fv">
          <div class="iconfont icon-falv icon2"></div>
        </div>

        <div class="text">法律法规</div>
      </div>
      <div class="item" @click="toEducation">
        <div class="bg bg_peixun">
          <div class="iconfont icon-peixun icon2"></div>
        </div>

        <div class="text">教育培训</div>
      </div>
      <div class="item" @click="toMeeting">
        <div class="bg bg_shipin">
          <div class="iconfont icon-shizhengxiaohuoshuan icon2"></div>
        </div>
        <div class="text">视频会议</div>
      </div>
    </div>