@click.stop 阻止事件冒泡

@click.prevent 阻止事件的默认行为

联合饿了吗UI使用的时候,el-table(主表)包含一个或多个子表时(el-tabs),点击右侧的编辑、删除时会同时触发el-table的current-change(),如果子表过多会,每次点击编辑/删除都会多次同时调用子表的数据查询接口,此时在编辑和删除的click事件加上

@click.stop.prevent会避免多次调用子表的查询接口(如下)

注:本人是在点击删除时根据tabs的一个或多个字表提示删除信息的不同用到了上述写法,做个记录

vue @click的stop和prevent的更多相关文章

  1. vue - @click 用到的修饰符

    1.vue提供的方法 .stop .prevent .capture .self .once .passive <!-- 阻止单击事件继续传播 --><a v-on:click.st ...

  2. vue click事件 v-on:click

    v-on:click <!DOCTYPE html> <html lang="en"> <head> <meta charset=&quo ...

  3. vue click事件获取当前元素属性

    Vue可以传递$event对象 <body id="app"> <ul> <li @click="say('hello!', $event) ...

  4. vue click.stop阻止点击事件继续传播

    <div id="app"> <div @click="dodo"> <button @:click="doThis&q ...

  5. vue click.stop

    <div id="app"> <div v-on:click="dodo"> <button v-on:click="d ...

  6. vue @click.native

    1,给vue组件绑定事件时候,必须加上native ,不然不会生效(监听根元素的原生事件,使用 .native 修饰符) 2,等同于在自组件中: 子组件内部处理click事件然后向外发送click事件 ...

  7. vue @click 使用三目运算(实现动态更换绑定的函数)

    转载:https://www.jianshu.com/p/ea4471c9f333 @click 错误写法 @click="dialogStatus=='create'?createData ...

  8. vue @click传字符串

    参考: https://www.cnblogs.com/springlight/p/5782637.html 关键:使用转译字符 \ 来转译引号 方法一. 直接传递: var tem = " ...

  9. vue - @click 传参删除

    <template>   <div id="app">      <div v-for="todo in  todos" :key ...

  10. vue.js 2.0开发(4)

    使用vue-cli,首先安装: npm install -g vue-cli 安装完了执行vue命令,会出现 vue init <template-name> <project-na ...

随机推荐

  1. 图解S.O.L.I.D原则

    如果您熟悉面向对象的编程,那么您可能已经听说过SOLID原理. 这五项软件开发原则是构建软件时要遵循的准则,以便于扩展和维护. 它们受到软件工程师Robert C. Martin的欢迎. 在线上有很多 ...

  2. kotlin的suspend对比csharp的async&await

    协程的出现大大降低了异步编程的复杂度,可以让我们像写同步代码一样去写异步代码,如果没有它,那么很多异步的代码都是需要靠回调函数来一层层嵌套,这个在我之前的一篇有介绍 rxjava回调地狱-kotlin ...

  3. .NET性能优化-使用内存+磁盘混合缓存

    我们回顾一下上一篇文章中的内容,有一个朋友问我这样一个问题: 我的业务依赖一些数据,因为数据库访问慢,我把它放在Redis里面,不过还是太慢了,有什么其它的方案吗? 其实这个问题比较简单的是吧?Red ...

  4. Encodings: URL

    原题链接:http://www.wechall.net/challenge/training/encodings/url/index.php 题目信息:你的任务就是解码下面的东西.... 这个完全没难 ...

  5. C++初阶(stack+queue)

    stack stack介绍 stack是一种先进后出的数据结构,只有一个出口,类似于栈.stack容器哦允许新增元素,移除元素,取得栈顶元素,但是除了最顶端之后,没有任何其他办法可以存取stack的其 ...

  6. 更换linux的开机启动图片, 启动主题

    简述 之前就想更改开机的启动图片,但是后来简单查了一下,说要重新编译内核,听到编译我就望而却步了,今天发现只是个命令而已,注意这里我用的是 linux mint .这里更改不是 grub 主题, 是 ...

  7. 猿人学web爬虫攻防大战

    这里有1.2.3.4.12.13.15题 1.第一题 import execjs import requests def get_response(): js_code = ""& ...

  8. 【转载】EXCEL VBA 通过VBA中的Union合并多个Range选择区域

    在Excel中,Union的功能是合并两个或两个以上的选择区域,合并成为一个更大的区域. 所合并的多个选择区域,这些选择区域,可以是不连续的,也可以是连续的.一般情况下,要使用Union,可通过如下来 ...

  9. 万字长文解析Scaled YOLOv4模型(YOLO变体模型)

    一,Scaled YOLOv4 摘要 1,介绍 2,相关工作 2.1,模型缩放 3,模型缩放原则 3.1,模型缩放的常规原则 3.2,为低端设备缩放的tiny模型 3.3,为高端设备缩放的Large模 ...

  10. [图像处理] YUV图像处理入门3

    5 yuv420格式的灰阶测试图 本程序中的函数主要是为YUV420P视频数据流的第一帧图像添加边框.函数的代码如下所示: /** * @file 5 yuv_graybar.cpp * @autho ...