在使用el-upload组件时,在其中放置了一个删除按钮的图片。

当点击图片,本想只删除上传的视频,但是意外触发了el-upload中的事件

解决办法:用stop,结果只删除当前预览,不触发上传事件。

@click.stop="deletePreview"

vue中click阻止事件冒泡,防止触发另一个事件的更多相关文章

  1. vue 中监听窗口发生变化,触发监听事件, window.onresize && window.addEventListener('resize',fn) ,window.onresize无效的处理方式

    // 开始这样写,不执行 window.onresize = function() { console.log('窗口发生变化') } // 改成window监听事件 window.addEventL ...

  2. window.open('') 火狐,IE事件冒泡处理,点击事件冒泡处理

    window.open('') 火狐,IE事件冒泡处理,点击事件冒泡处理 写PC下拉菜单的时候,hover样式显示下拉菜单,可能会这样写 <li class="xb_li1" ...

  3. JS中的事件冒泡(Bubble)和事件捕获(capture)以及如何阻止事件的冒泡

    对“捕获”和“冒泡”这两个概念,通常我们对冒泡了解和使用的会更多一些,因为在我们使用的所有浏览器中,都支持事件冒泡 ,即事件由子元素向祖先元素传播的,就 像气泡从水底向水面上浮一样.而在像firefo ...

  4. jQuery 学习笔记(5)(事件绑定与解绑、事件冒泡与事件默认行为、事件的自动触发、自定义事件、事件命名空间、事件委托、移入移出事件)

    1.事件绑定: .eventName(fn) //编码效率略高,但部分事件jQuery没有实现 .on(eventName, fn) //编码效率略低,所有事件均可以添加 注意点:可以同时添加多个相同 ...

  5. vue-阻止事件冒泡-开启右键-键盘类事件

    一: 阻止事件冒泡 布局: 当点击按钮时,会触发button的click 也会触发父级的方法 <div id="box"> <div @click="p ...

  6. JS事件冒泡机制和兼容性添加事件

    本篇文章主要来讲讲 事件的冒泡机制 和 添加事件的几种方法. 一. JS的时间传递顺序: 捕获阶段 -> 目标阶段 -> 冒泡阶段 捕获阶段是指从父层往子层找.比如 <body> ...

  7. Javascript 事件对象(四)一个事件绑定多个不同的函数

    给一个对象绑定多个事件处理函数: <!DOCTYPE HTML> <html> <head> <meta http-equiv="Content-T ...

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

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

  9. vue 中 @click.native.prevent 事件

    在项目中看到@click.native.prevent, 查了一点资料 总结一下, 1.给vue组件绑定事件时候,必须加上native ,否则会认为监听的是来自Item组件自定义的事件, 2.prev ...

随机推荐

  1. Linux基础命令---ifcfg

    ifcfg ifcfg是一个简单的脚本替换iconfig命令,它可以设置网络接口的ip地址. 此命令的适用范围:RedHat.RHEL.Ubuntu.CentOS.SUSE.openSUSE.Fedo ...

  2. Inception 模型

    https://blog.csdn.net/xxiaozr/article/details/71481356 inception v1: 去除了最后的全连接层,使用全局平均池化层来代替,因为全连接层的 ...

  3. 4~20mA电流输出芯片XTR111完整电路(转)

    源: 4~20mA电流输出芯片XTR111完整电路

  4. Golang命令行拷贝文件

    package main import ( "fmt" "io" "os" ) func main() { list := os.Args ...

  5. 如何通过 Vue+Webpack 来做通用的前端组件化架构设计

    目录:   1. 架构选型     2. 架构目录介绍     3. 架构说明     4. 招聘消息 目前如果要说比较流行的前端架构哪家强,屈指可数:reactjs.angularjs.emberj ...

  6. 细谈 Web Api 图片上传,在使用 Task.ContinueWith 变量无法赋值问题的解决办法!

    在使用Asp.Net Web Api 图片上传接口的时候,到网上找了一些个例子,但大多数找到都是这个版本! [HttpPost] public Task<Hashtable> ImgUpl ...

  7. 【题解】bzoj 4478 [Jsoi2013]侦探jyy

    原题传送门 弱智搜索题 我们就枚举每个点,先判断它是否必须发生,如果没有必须发生,开始搜索它的祖先,如果祖先中有必须发生的,那么它就必须发生,如果祖先中没有必须发生的,那么搜索所有入度为0的点(除了它 ...

  8. Python3+Dlib实现简单人脸识别案例

    Python3+Dlib实现简单人脸识别案例 写在前边 很早很早之前,当我还是一个傻了吧唧的专科生的时候,我就听说过人脸识别,听说过算法,听说过人工智能,并且也出生牛犊不怕虎般的学习过TensorFl ...

  9. pycharm 安装激活操作

    pycharm 安装激活操作 什么是 PyCharm PyCharm是一种Python IDE,带有一整套可以帮助用户在使用Python语言开发时提高其效率的工具,比如调试.语法高亮.Project管 ...

  10. 混合模式程序集是针对“v2.0.50727”版的运行时生成的,在没有配置其他信息的情况

    在app.config中的configuration节内添加子节Startup,详细如下: <?xml version="1.0"?><configuration ...