@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. MASA Framework -- 跨进程事件 IntegrationEventBus入门与设计

    概述 跨进程事件总线允许发布和订阅跨服务传输的消息, 服务的发布与订阅不在同一个进程中 在Masa Framework中, 跨进程总线事件提供了一个可以被开箱即用的程序 IntegrationEven ...

  2. Java阻塞队列中的异类,SynchronousQueue底层实现原理剖析

    上篇文章谈到BlockingQueue的使用场景,并重点分析了ArrayBlockingQueue的实现原理,了解到ArrayBlockingQueue底层是基于数组实现的阻塞队列. 但是Blocki ...

  3. 【Devexpress】pivotGridControl设置不显示展开折叠按钮

    只需要设置.效果看图二

  4. 函数调用时用const保护指针

    当调用函数并且把指向变量的指针作为参数传入时,通常会假设函数将修改变量(否则,为什么函数需要指针呢?).例如,如果在程序中看到语句 f(&x); 大概是希望f改变x的值.但是,f仅需检查x的值 ...

  5. Python中内置数据库!SQLite使用指南! ⛵

    作者:韩信子@ShowMeAI Python3◉技能提升系列:https://www.showmeai.tech/tutorials/56 本文地址:https://www.showmeai.tech ...

  6. 【Java框架】SSM-Spring总结:IOC、DI、AOP、JDBC、事务管理、实际案例

    〇.概述 1.常用资料 2.组成 一.控制反转与依赖注入 (一)Spring概述 1.介绍 以IOC和AOP为内核的框架 通过IOC实现控制,使用spring创建对象,与DI描述同一个概念 DI是对象 ...

  7. C语言条件语句中调用函数并赋值时的一个小坑

    在C语言中,如果在条件语句中赋值,一定要注意符号优先级的问题,比较符号是比赋值符号先执行的.如果同时还调用函数,并将返回值赋给变量,更容易产生错误. 看下面的代码: int increase(int ...

  8. ExcelToObject.NPOI 两行代码导出Excel报表、读取Excel数据

    简介 作为一个dotnet开发者,经常面对业务系统中大量报表导入导出,经常写了一堆的重复代码.最近发现一个操作excel的神器:ExcelToObject.NPOI,两行代码就能导出一个报表,两行代码 ...

  9. 基于 Spring Cloud 的微服务脚手架

    基于 Spring Cloud 的微服务脚手架 作者: Grey 原文地址: 博客园:基于 Spring Cloud 的微服务脚手架 CSDN:基于 Spring Cloud 的微服务脚手架 本文主要 ...

  10. 史上最小 x86 Linux 模拟器「GitHub 热点速览 v.22.50」

    本周 GitHub Trending 略显冷清,大概是国内的人们开始在养病,而国外的人们开始过圣诞.元旦双节.热度不减的 ChatGPT 依旧占据了本周大半的 GitHub 热点项目,不过本周的特推和 ...