用了Element ui写页面

<el-dropdown-menu slot="dropdown">
<el-dropdown-item>

<el-select size="mini" v-model="searchInfo.plan" placeholder="请选择" >
<el-option v-for="(item,index) in plansItems" :key="index" :label="item.caption" :value="item.planId">
</el-option>
</el-select>

</el-dropdown-menu>

</el-dropdown-item>

情况出现:就是我在下拉菜单里放了选择框,在点选择框内容时会出现 下拉菜单收起。

正常情况:在选择框加一个vue自带的阻止冒泡事件 @click.stop

但是出乎我意料 这居然无效,加了和没加 一样的效果 然后我就去查阅资料

发现在选择框加一句 属性申明就可以了popper-append-to-body=“false” 或者:popper-append-to-body=“value” 然后再value的值=flase

最后解决了 我碰到的这个问题

vue之冒泡阻止的更多相关文章

  1. Js阻止冒泡,Vue中如何阻止冒泡事件

    js解决冒泡:event.stopPropagation() vue解决冒泡: 事件.stop,例如:@click.stop="" ,@mouseover.stop="& ...

  2. Vue的冒泡事件

    由于业务需求需要,需要在一个元素中的子元素添加一个点击事件. 但是刚好父元素也有一个点击事件.这个时候我们就需要使用到Vue中的阻止事件冒泡了.

  3. JavaScript中捕获/阻止捕获、冒泡/阻止冒泡

    JavaScript中捕获/阻止捕获.冒泡/阻止冒泡 事件流描述的是从页面中接收事件的顺序.提出事件流概念的正是IE和Netscape,但是前者提出的是我们常用的事件冒泡流,而后者提出的是事件捕获流. ...

  4. JS中点击事件冒泡阻止

    JS中点击事件冒泡阻止 解析: 一个div层'out',内含有一个div层'in'.如下: 两个层都绑定了点击事件,但是点击in层的时候,点击事件会出现冒泡现象,同时也会触发out层的点击事件. 但是 ...

  5. js 事件流和事件冒泡阻止

    js 事件流和事件冒泡阻止 事件流 当浏览器发展到第四代的时候(IE4与Netscape4)浏览器开发团队遇到一个有意思的的问题: 页面的哪一部分会拥有某个特定的事件? 比如在纸上画上一组同心圆,如果 ...

  6. 重新认识vue之事件阻止冒泡

    冒泡的表现 近期用vue做了一个需求,大概是同一个区域,点击不同位置有不同的响应函数,还有个总的响应函数,好吧,如下图所示: 他们的DOM结构如下: <div v-for="(item ...

  7. vue 事件上加阻止冒泡 阻止默认事件

    重点 vue事件修饰符 <!-- 阻止单击事件冒泡 --> <a v-on:click.stop="doThis"></a> <!-- 提 ...

  8. vue中click阻止事件冒泡,防止触发另一个事件

    在使用el-upload组件时,在其中放置了一个删除按钮的图片. 当点击图片,本想只删除上传的视频,但是意外触发了el-upload中的事件 解决办法:用stop,结果只删除当前预览,不触发上传事件. ...

  9. 阻止vue事件冒泡的方法

随机推荐

  1. SpringMVC学习笔记一:采用注解式搭建简单springMVC环境

    搭建的环境使用的是maven项目 项目目录树: 搭建环境使用的jar包,pom.xml文件 <project xmlns="http://maven.apache.org/POM/4. ...

  2. Caused by: com.alibaba.fastjson.JSONException: syntax error, expect {, actual [, pos 0, fastjson-version 1.2

    环境: vue.js 问题: 当添加评论时 重新查询数据刷新数据控制台异常Caused by: com.alibaba.fastjson.JSONException: syntax error, ex ...

  3. Linux系统添加新用户

    Linux系统中一般不直接使用root用户进行操作,需要添加新的用户. 首先,查看当前系统已有的用户 cat /etc/passwd 查看用户组 cat /etc/group 其次,添加想要的用户组和 ...

  4. 吴裕雄--天生自然KITTEN编程:翻译机

  5. 一站式自动化测试平台 http://www.Autotestplat.com

    Autotestplat 一站式自动化测试平台及解决方案 自动化平台开发 3.1 自动化平台开发方案 3.1.1 功能需求 支持 API.AppUI.WebUI 性能等自动化测试,集成实现测试用例管理 ...

  6. Docker快速安装kafka

    Docker快速安装kafka | 沈健的技术博客 盒子 盒子 博客 分类 标签 友链 搜索 文章目录 同样基于docker-compose安装,Docker快速部署nginx中有讲到,不在重述 1. ...

  7. Django+Celery框架自动化定时任务开发

    本章介绍使用DjCelery即Django+Celery框架开发定时任务功能,在Autotestplat平台上实现单一接口自动化测试脚本.业务场景接口自动化测试脚本.App自动化测试脚本.Web自动化 ...

  8. 创建 GPG 证书

    一.什么是 GPG 以下引自维基百科: GNU Privacy Guard(GnuPG或GPG)是一种加密软件,它是PGP加密软件的满足GPL的替代物.GnuPG依照由IETF订定的OpenPGP技术 ...

  9. Circles of Waiting

    题目传送门 很容易列出期望的方程,高斯消元搞一波但是常规消元复杂度是$O(r^6)$的考虑从左到右从上到下编号然后按编号从小到大消元假设黄点是已经消元的点,那么消下一个点的时候,只有绿点的方程中该项系 ...

  10. linux中nginx、mysql安装碰到的问题

    服务器到期新买了一台服务器,记录一下重新安装基本环境碰到了一些问题 安装nginx 1. 启动失败 403 forbidden nginx 解决方案:(个人使用直接用了root账号,修改对应nginx ...