vue click.stop阻止点击事件继续传播的方法
2018-09-04 12:05
1061 查看
如下所示:
<div id="app"> <div v-on:click="dodo"> <button v-on:click="doThis">阻止单击事件继续传播</button> </div> </div> <script> var app = new Vue({ el: "#app", data: { name: "Vue.js" }, methods: { doThis: function () { alert("noclick"); }, dodo: function () { alert("dodo"); } } }); </script>
将会先弹出“noclick”,再弹出“dodo”。
<div id="app"> <div v-on:click="dodo"> <button v-on:click.stop="doThis">阻止单击事件继续传播</button> </div> </div> <script> var app = new Vue({ el: "#app", data: { name: "Vue.js" }, methods: { doThis: function () { alert("noclick"); }, dodo: function () { alert("dodo"); } } }); </script>
只弹出“noclick”
以上这篇vue click.stop阻止点击事件继续传播的方法就是小编分享给大家的全部内容了,希望能给大家一个参考,也希望大家多多支持脚本之家。
您可能感兴趣的文章:
相关文章推荐
- vue click.stop阻止点击事件继续传播
- 移动端点击(click)事件延迟问题的产生与解决方法
- js阻止冒泡事件继续传播
- vue2.x---vue-router如何在router-link标签绑定click点击事件、keyup、change等事件
- jquery阻止冒泡事件:$('span').bind("click",function(event){event.stopPropagation();})(有用源)
- 在vue中无论使用router-link 还是 @click事件,发现都没法从列表页点击跳转到内容页去
- jquery阻止冒泡事件:$('span').bind("click",function(event){event.stopPropagation();})(有用源)
- framework7 vue touch事件 阻止click事件失效
- JavaScript实现事件的中断传播和行为阻止方法示例
- vue引入echarts、找不到的图表引入方法、图表中的点击事件
- vue二级菜单导航点击选中事件的方法
- 在vue中实现点击选择框阻止弹出层消失的方法
- click点击一次触发多次,冒泡与阻止冒泡,event.stopPropagation()和event.preventDefault(),return false三种的区别
- png透明部分取消点击&后边的控件事件不阻止的方法
- vue通过点击事件读取音频文件的方法
- div嵌套点击事件问题解决方法-阻止冒泡事件
- 阻止click点击事件
- 在Vue组件中获取全局的点击事件方法
- Apple 移动设备绑定动态生成元素点击事件$(document).on('click',element,callback)失效解决方法
- jquery阻止冒泡事件:$('span').bind("click",function(event){event.stopPropagation();})(有用源)