@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. <一>继承的基本意义

    1:继承的本质和原理 2:派生类的构造过程 3:重载,覆盖,隐藏 4:静态绑定和动态绑定 5:多态,vfptr,vftable 6:抽象类的设计原理 7:多重继承以及问题 8:虚基类 vbptr 和v ...

  2. Springboot 2.3.1配置拦截器遇到的坑

    1.多个配置类继承WebConfigureSupport或实现WebConfigure接口导致拦截器失效 2.拦截器中的bean无法正常注入,SpringBoot项目的Bean装配默认规则是根据App ...

  3. Go | 闭包的使用

    闭包基本介绍 闭包就是 一个函数 和其相关的 引用环境 组合的一个整体 好处: 保存引用的变量,下次继续使用,不会销毁 下面通过闭包的方式,写一个数字累加器,体验一下闭包的妙处 闭包实现数字累加 pa ...

  4. Spring面试点汇总

    Spring面试点汇总 我们会在这里介绍我所涉及到的Spring相关的面试点内容,本篇内容持续更新 我们会介绍下述Spring的相关面试点: Spring refresh Spring bean Sp ...

  5. from表单前后端数据编码格式-Ajax发送json格式数据-Ajax发送文件-Django自带序列化组件-Ajax结合sweetalert

    目录 一:前后端传输数据的编码格式(contentType) 1.研究post请求数据的编码格式 2.可以朝后端发送post请求的方式 3.前后端传输数据的编码格式 4.研究form表单 5.当for ...

  6. PHP 视频源文件加密方案

    先说下原理:因为视频是付费的,肯定需要作视频加密处理. 加密可实现的方式:修改视频字节流,只能替换字节流,例如头100-1024字节进行加密,源文件就无法打开了. 下面上代码吧,加解密是 openss ...

  7. 解读JVM级别本地缓存Caffeine青出于蓝的要诀3 —— 讲透Caffeine的数据驱逐淘汰机制与用法

    大家好,又见面了. 本文是笔者作为掘金技术社区签约作者的身份输出的缓存专栏系列内容,将会通过系列专题,讲清楚缓存的方方面面.如果感兴趣,欢迎关注以获取后续更新. 上一篇文章中,我们聊了下Caffein ...

  8. [数据结构]单向链表及其基本操作(C语言)

    单向链表 什么是单向链表 链表是一种物理储存单元上非连续.非顺序的储存结构.它由一系列结点(链表中每一个元素称为结点)组成,结点可动态生成.每个结点包括两个部分:一个是存储数据元素的数据域,另一个是存 ...

  9. JavaScript:输出语法

    主要有三种,如下所示:

  10. 【博学谷学习记录】超强总结,用心分享|前端开发HTML知识总结

    HTML知识总结 字体加粗标签 注释快捷键 Ctrl + / 代码后缩进:shift + tad 1HTML标签 1.1排版标签介绍 1.1.1标题标签 <h1>1级标题<h1/&g ...