事件对象:

v-on:click/mouseover
简写:
    @click=""
 
     @click="show($event)"
<input type="button" value="按钮" @click=“show($event,12)”
methods: {
show: function(ev, b){
alert(ev.clientX);
}
}
 
 
    ev.clickX

事件冒泡:

阻止冒泡:

            a) ev.cancelBubble=true;      (原生js语法)
             b) @click.stop="show()" 推荐使用

默认行为(默认事件)

       阻止默认行为:
            a) @contextmenu.prevent="show()"  右键行为事件,但右键有个默认行为;推荐使用
            b) ev.preventDefault() (原生js语法,阻止默认行为)

键盘事件

    @keydown="show(event)"  ev.keyCode
    @keyup
        回车:
                @keyup.13
                @keyup.enter
        上下左右
                @keyup/keydown/l
                @up, down left, right

vue的事件对象的更多相关文章

  1. vue的事件对象,方法执行

    方法都写在methods重,有两种写法:1. getMsg:function(){ alert(); },  这种写法就是对象中的方法 2. getMsg1(){ alert(); }注意没有func ...

  2. vue的事件

    vue的事件: vue事件简写: vue中事件是 v-on:click=' show()'    但是我嫌弃它写太长每次都要 v-on: 事件 vue中就有事件简写   @click='show()' ...

  3. React对比Vue(03 事件的对比,传递参数对比,事件对象,ref获取DOM节点,表单事件,键盘事件,约束非约束组件等)

    import React from 'react'; class Baby extends React.Component { constructor (props) { super(props) t ...

  4. vue 定义方法执行方法 获取数据 改变数据 执行方法传值 以及事件对象

    <template> <div id="app"> <!-- <img v-bind:src='url' /> <img :src= ...

  5. vue教程1-05 事件 简写、事件对象、冒泡、默认行为、键盘事件

    vue教程1-05 事件 简写.事件对象.冒泡.默认行为.键盘事件 v-on:click/mouseover...... 简写的: @click="" 推荐 事件对象: @clic ...

  6. Vue 获取数据、事件对象、todolist

    vue中在方法里获取data里的msg:this.msg 在微信小程序里this.data.msg 改变data里的msg:this.msg="改变后的msg" 可以通过list. ...

  7. Vue事件 定义方法执行方法 获取数据 改变数据 执行方法传值 以及事件对象

    <template> <div id="app"> <!-- <img v-bind:src='url' /> <img :src= ...

  8. 【vue】@click绑定的函数,如何同时传入事件对象和自定义参数

    知识很久不用的话,果然是容易忘的... 记记笔记,希望能加深点印象吧. [仅仅传入事件对象] html: <div id="app"> <button @clic ...

  9. React 事件对象、键盘事件、表单事件、ref获取dom节点、react实现类似Vue双向数据绑定

    1.案例实现代码 import React, { Component } from 'react'; /** * 事件对象.键盘事件.表单事件.ref获取dom节点.react实现类似Vue双向数据绑 ...

随机推荐

  1. openresty开发系列23--lua面向对象

    openresty开发系列23--lua面向对象 面向对象编程(Object Oriented Programming,OOP)是一种非常流行的计算机编程架构.java,c++,.net等都支持面向对 ...

  2. shell编程系列1--shell脚本中的变量替换

    shell编程系列1--shell脚本中的变量替换 变量替换总结: .${变量#匹配规则} # 从头开始匹配,最短删除 .${变量##匹配规则} # 从头开始匹配,最长删除(贪婪模式) .${变量%匹 ...

  3. linux安装上传下载工具lrszs

    普通用户下使用sudo获取root权限,root用户直接安装: [mall@VM_0_7_centos ~]$ sudo yum -y install lrzsz Loaded plugins: fa ...

  4. 【Java】Spring快速入门(一)

    Spring介绍 Spring可以轻松创建Java企业应用程序.它提供了在企业环境中使用Java语言所需的一切,支持Groovy和Kotlin作为JVM上的替代语言,并可根据应用程序的需要灵活地创建多 ...

  5. 转Python开发之AJAX全套

    转自:https://www.cnblogs.com/nulige/p/6603415.html#4206261

  6. 深度技术W10系统中绑定MAC地址和IP地址的设置技巧

    深度技术W10系统中绑定MAC地址和IP地址的设置技巧分享给大家,感兴趣的用户,请一起来了解下,以备以后作参考,具体如下:1.点击“开始——搜索”,输入CMD命令,然后在CMD上右键选择以管理员身份运 ...

  7. JS 多数组中取最大数组,分组

    代码小结,使用 JS 对数据进行分组,对分组中的数组取最大数组: var combineTemplate = JSON.parse(data.combineTemplate); //根据仪器种类ID分 ...

  8. Appium移动自动化测试-----(十三)appium API 之其他操作

    其它操作针对移动设备上特有的一些操作. 1.熄屏 方法: * lockDevice() 点击电源键熄灭屏幕. 在iOS设备可以设置熄屏一段时间.Android上面不带参数,所以熄屏之后就不会再点亮屏幕 ...

  9. Qt跨平台原理

    Qt跨平台原理: 和java一样,针对每一种OS平台,QT都有一套对应的底层类库,而接口是完全一致的. 因此只要是在QT库上开发的程序,放在任何一种平台下都可以编译运行(前提条件是:程序中没有使用某O ...

  10. idea导入eclipse包乱码问题全局解决方案:

    IJ导入eclipse包乱码问题: 全局解决方案: 设置所在文件夹位置 1.从eclipse导入方式,发现还是乱码 2.导航栏点击文件->设置->editor->文件编码 将所在文件 ...