vue.js阻止事件冒泡和默认事件
首先我们来看原生JS取消事件冒泡方法:
e.stopPropagation(); //非IE浏览器 window.event.cancelBubble = true; //IE浏览器
原生JS阻止默认事件方法:
e.preventDefault(); //非IE浏览器
window.event.returnValue = false; //IE浏览器
而vue.js给我们提供了更简便的方法,我们可以通过function($event)来获取事件对象,$event.target则是选择发生事件的目标元素:
//html
<p @click="getEventTar($event)">Test</p>
//JS
getEventTar(el){
console.log(el.target); //<p>Test</p>,这里就相当于通过原生JS获取dom元素而后可以对其进行一些操作
}
vue.js取消冒泡事件
//只需将click改成click.stop <p @click.stop="getEventTar($event)">Test</p>
vue.js阻止默认事件
//只需将click改成click.prevent
<p @click.prevent="getEventTar($event)">Test</p>本文内容仅供个人学习、研究或参考使用,不构成任何形式的决策建议、专业指导或法律依据。未经授权,禁止任何单位或个人以商业售卖、虚假宣传、侵权传播等非学习研究目的使用本文内容。如需分享或转载,请保留原文来源信息,不得篡改、删减内容或侵犯相关权益。感谢您的理解与支持!