微信公众号搜"智元新知"关注
微信扫一扫可直接关注哦!

在vue中实现点击选择框阻止弹出层消失的方法

<p style="text-align: center">

在vue项目中,选择性别是用的一个弹出层,

rush:js;">
  • dio" name="sex" value="男">
  • dio" name="sex" value="女">
  • 已经给这个.sex层绑定了一个v-show条件,实现了点击显示隐藏的效果

    但是因为这个效果是加在父级上,所以在选择性别的时候,也会关闭弹出层,这个问题其实是一个冒泡事件,要解决这个问题用vue的阻止冒泡的属性stop即可

    rush:js;">

    这个方法不写也可以,或者写成

    rush:js;">

    除了这个地方以外,还有一个弹出层,需要点击弹出层以外的地方关闭这个弹出层,如图:

    如:

    rush:js;">

    这种情况下点击了按钮以后,弹出层不会显示,这是因为在父级上设置了checktanchuceng事件,冲突了,所以要给按钮加上阻止冒泡的方法,改成:

    rush:js;">

    以上这篇在vue中实现点击选择框阻止弹出层消失的方法就是小编分享给大家的全部内容了,希望能给大家一个参考,也希望大家多多支持编程之家。

    原文地址:https://www.jb51.cc/vue/30182.html

    版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。

    相关推荐