<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的更多相关文章

  1. vue click事件 v-on:click

    v-on:click <!DOCTYPE html> <html lang="en"> <head> <meta charset=&quo ...

  2. vue - @click 用到的修饰符

    1.vue提供的方法 .stop .prevent .capture .self .once .passive <!-- 阻止单击事件继续传播 --><a v-on:click.st ...

  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.native

    1,给vue组件绑定事件时候,必须加上native ,不然不会生效(监听根元素的原生事件,使用 .native 修饰符) 2,等同于在自组件中: 子组件内部处理click事件然后向外发送click事件 ...

  6. vue @click 使用三目运算(实现动态更换绑定的函数)

    转载:https://www.jianshu.com/p/ea4471c9f333 @click 错误写法 @click="dialogStatus=='create'?createData ...

  7. vue @click传字符串

    参考: https://www.cnblogs.com/springlight/p/5782637.html 关键:使用转译字符 \ 来转译引号 方法一. 直接传递: var tem = " ...

  8. vue - @click 传参删除

    <template>   <div id="app">      <div v-for="todo in  todos" :key ...

  9. 实现点击页面其他地方,隐藏div(原生和VUE)

    1原生方法 // html <div id="box" style="width:110px;height:110px;background-color:red&q ...

随机推荐

  1. C# 父类代码动态转换子类

    百度上搜索C# 如何父类运行时转换成子类,没有得到相应答案,突然想起C# 有dynamic类型试试看结果成功了... 以后编写代码类似这样的代码 就可以删减掉了 if (en.type == EMap ...

  2. vue项目更换目录后执行npm run dev 就报错(新手进)

    在我们搭建好一个VUE项目的环境后,觉得这个项目存放的位置不好,想移动一下,但是移动后我们发现执行npm run dev就会报下面的错误: 明明只是移动了一下位置,就报错,实在是太恶心了. 但是只要我 ...

  3. copy语法

    copy 和 mutableCopy 一个对象使用copy或者mutableCopy方法可以创建对象的副本 --------------- copy - 需要先实现NSCopying协议,创建的是不可 ...

  4. TCO14 Wildcard CountTables——斯特林反演

    不知道咕了多长时间的题... 讲了3遍,还是自己搞懂了.. 暂时没有找到题目链接 题意: n×m的网格,每个格子填[1,x]的数,使得不存在两行两列同构. 先保证一个,行相同. 再容斥掉列. 枚举至多 ...

  5. pm2 常用配置项解析

    1.解析 1. apps:json结构,apps是一个数组,每一个数组成员就是对应一个pm2中运行的应用 2. name:应用程序名称"app" 3. cwd:应用程序所在的目录& ...

  6. Go项目的测试代码1(基础)

    最近写了测试代码,整理了一下. 先看看简单的测试代码. // add_test.go ==> 文件名 _test.go 结尾的默认为测试代码文件 package models import ( ...

  7. 如何使用git send-email发送补丁?

    答: git send-email <patch-name> --to <username>@<example>.com --cc <username> ...

  8. 胆机实作(1)——12AU7甲类单端前级

    第一次做胆机,选了最经典的单端共阴架构.电路没有什么复杂的,基本就是教科书电路,没有用负反馈,因为我不喜欢负反馈的声音.用电路板做机器焊接也没什么难度,器件找好开焊就行,试做机就不打算找外壳了,也不用 ...

  9. Java同步数据结构之Collection-Queue

    概述 接下来开始学习java.util.concurrent包中一些Collection集合的子类,关于Map的一些子类将在这些子类完成之后再开始学习.下图是Java并发包中关于Collection接 ...

  10. 如何应对POST方式下载文件的接口

    jQuery的下载,需要承载一个插件去做 今天遇到一个问题,后台给的接口由于需要前端传入过多的参数,只能接受用post去下载文件.正常情况下第一反应是用xhr对象去发送post请求,结果并没有触发浏览 ...