解决VUE框架 导致绑定事件的阻止冒泡失效问题
时间:2019-04-13
本文章向大家介绍解决VUE框架 导致绑定事件的阻止冒泡失效问题,主要包括解决VUE框架 导致绑定事件的阻止冒泡失效问题使用实例、应用技巧、基本知识点总结和需要注意事项,具有一定的参考价值,需要的朋友可以参考一下。
前面遇到了一个问题就是VUE框架内部做了一些处理,使得在我们通过v-for渲染DOM的时候添加新元素的时候,绑定事件也能对新增的元素有效。
而这次遇到的问题则是,原本绑定事件中(该函数没有写在vue实例的methods中),导致阻止冒泡事件失效了。无论是return false 还是event.stopPropagation();都无效。
此时需要通过用VUE提供了事件修饰符来处理,比如阻止事件冒泡@click.stop='xx()'
.stop
.prevent
.capture
.self
.once
<a v-on:click.stop="doThis"></a> <!-- 提交事件不再重载页面 --> <form v-on:submit.prevent="onSubmit"></form> <!-- 修饰符可以串联 --> <a v-on:click.stop.prevent="doThat"></a> <!-- 只有修饰符 --> <form v-on:submit.prevent></form> <!-- 添加事件侦听器时使用事件捕获模式 --> <div v-on:click.capture="doThis">...</div> <!-- 只当事件在该元素本身(比如不是子元素)触发时触发回调 --> <div v-on:click.self="doThat">...</div>
以上这篇解决VUE框架 导致绑定事件的阻止冒泡失效问题就是小编分享给大家的全部内容了,希望能给大家一个参考,也希望大家多多支持脚本之家。
- HDUOJ----Super Jumping! Jumping! Jumping!
- HDUOJ----数塔
- Golang语言-并发支持
- HDUOJ-----I NEED A OFFER!
- HDUOJ---2546 饭卡
- 假期前的数据库检查脚本之主备关系(r11笔记第46天)
- HDUOJ----1003 Max Sum
- HDUOJ--Bone Collector
- HDUOJ--1058HangOver
- 免插件实现WordPress的Sitemap功能
- HDUOJ--1865 1string
- Golang语言延迟函数defer用法分析
- HDUOJ---大菲波数
- HDUOJ Children’s Queue
- JavaScript 教程
- JavaScript 编辑工具
- JavaScript 与HTML
- JavaScript 与Java
- JavaScript 数据结构
- JavaScript 基本数据类型
- JavaScript 特殊数据类型
- JavaScript 运算符
- JavaScript typeof 运算符
- JavaScript 表达式
- JavaScript 类型转换
- JavaScript 基本语法
- JavaScript 注释
- Javascript 基本处理流程
- Javascript 选择结构
- Javascript if 语句
- Javascript if 语句的嵌套
- Javascript switch 语句
- Javascript 循环结构
- Javascript 循环结构实例
- Javascript 跳转语句
- Javascript 控制语句总结
- Javascript 函数介绍
- Javascript 函数的定义
- Javascript 函数调用
- Javascript 几种特殊的函数
- JavaScript 内置函数简介
- Javascript eval() 函数
- Javascript isFinite() 函数
- Javascript isNaN() 函数
- parseInt() 与 parseFloat()
- escape() 与 unescape()
- Javascript 字符串介绍
- Javascript length属性
- javascript 字符串函数
- Javascript 日期对象简介
- Javascript 日期对象用途
- Date 对象属性和方法
- Javascript 数组是什么
- Javascript 创建数组
- Javascript 数组赋值与取值
- Javascript 数组属性和方法
- 详解linux dma驱动编写
- CentOS6.5环境安装nginx服务器及负载均衡配置操作详解
- 详解linux 驱动编写(sd卡驱动)
- Centos 6.9环境下创建用户及删除用户的方法
- 详解linux驱动编写(入门)
- Ubuntu使用国内源出现Hash Sum mismatch错误的解决
- CentOS基于nginx反向代理实现负载均衡的方法
- CentOS7服务器环境下vsftpd安装及配置方法
- Linux date 时间设置同步命令分享
- Gerrit设置开机启动方法
- Ubuntu服务器下搭建php运行环境的方法
- 详解ubuntu14.04搭建(迁移)hustoj记录
- linux 触摸屏驱动编写
- centos yum更新及删除多余启动项
- React进阶(1)-理解Redux