<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. NFFM的原理与代码

    本篇深入分析郭大nffm的代码 TensorFlow计算图 计算图的构建 ones = tf.ones_like(emb_inp_v2) mask_a = tf.matrix_band_part(on ...

  2. 给类或者类的对象添加打印内容 def __repr__(self)

    通常情况下 打印一个类或者类的对象 会显示 xx.xx object at 0xaaaaabbbbbbb  只会告诉你这个对象或者类 储存在某个内存中,这是因为你的类没有实现相关的打印功能 print ...

  3. java TimeUnit 的使用

    主要作用 时间颗粒度转换 延时 1.时间颗粒度转换 public long toMillis(long d) //转化成毫秒 public long toSeconds(long d) //转化成秒 ...

  4. Ubuntu 安装 JDK1.8

    以下是Ubuntu 14.04安装JDK1.8.0_25与配置环境变量过程笔记. 1.源码包准备: 首先到官网下载jdk,http://www.oracle.com/technetwork/java/ ...

  5. consul ocelot

    consul配置完成后 新建.netcoreapi项目, nuget安装ocelot 添加多个配置文件,.netcore中会自动合并为一个文件,global配置总的配置,其他为各个项目的配置 Serv ...

  6. 数据分析 - matpltlib 模块

    matplotlib 模块 引入模块 import matplotlib.pyplot as plt 设置图片大小 - figure 展示图片 - show 画图 - 实例化后指定类型画图 plot  ...

  7. 008-centos6.5搭建web服务【nginx-tomcat8-jre8】

    一.机器配置 yum install vim 1.1.Linux最大进程以及打开文件数 ulimit -n和-u可以查看linux的最大进程数和最大文件打开数. ulimit -a 展示所有 临时方法 ...

  8. linux的dos开关机命令

    常用:halt.reboot CentOS关机命令: 重启命令 reboot shutdown -r now 立刻重启 shutdown -r 10 过10分钟自动重启 shutdown -r 20: ...

  9. Python异步IO之协程(一):从yield from到async的使用

    引言:协程(coroutine)是Python中一直较为难理解的知识,但其在多任务协作中体现的效率又极为的突出.众所周知,Python中执行多任务还可以通过多进程或一个进程中的多线程来执行,但两者之中 ...

  10. golang 操作ceph object storage

    ceph的object storage 提供了和amazon s3兼容的接口以供客户访问. 在ceph的官网上,可以看到它提供了多种语言的访问范本,例如python的(http://docs.ceph ...