keyup.enter.native&click.native.prevent

vue 监听键盘回车事件 @keyup.enter || @keyup.enter.native
vue运行为v-on在监听键盘事件时,添加了特殊的键盘修饰符:
<input v-on:keyup.13="submit">
vue还非常贴心地给出了常用按键的别名,这样就不必去记keyCode ~ ~
上面代码,还可以在这样写:
<input v-on:keyup.enter="submit">
<input @keyup.enter="submit">
注意!!!如果用了封装组件的话,比如element,这个时候使用按键修饰符需要加上.native
比如:
<el-input v-model="account" placeholder="请输入账号" @keyup.enter.native="search()"></el-input>
@click-native-prevent
1.在封装好的组件上使用,所以要加上.native才能click
2.prevent就相当于..event.preventDefault()
jQuery 事件 - preventDefault() 方法

preventDefault() 方法阻止元素发生默认的行为(例如,当点击提交按钮时阻止对表单的提交)。
所以@submit.native.prevent是用来阻止默认行为的。
keyup.enter.native&click.native.prevent的更多相关文章
- vue 监听键盘回车事件 @keyup.enter || @keyup.enter.native
vue运行为v-on在监听键盘事件时,添加了特殊的键盘修饰符:\ <input v-on:keyup.13="submit"> vue还非常贴心地给出了常用按键的别名, ...
- Vue之@click、事件修饰符@click.stop与@click.prevent、按键修饰符@keyup.enter
1.绑定监听@click: (以监听click为例,其他如keyup,用法类似) v-on:click="fun" @click="fun" @click ...
- vue 中 @click.native.prevent 事件
在项目中看到@click.native.prevent, 查了一点资料 总结一下, 1.给vue组件绑定事件时候,必须加上native ,否则会认为监听的是来自Item组件自定义的事件, 2.prev ...
- vue 中给组建绑定原生事件@click.native=""
<template> <div class="div"> //组建使用 <v-header @click.native=& ...
- @click.native 会触发原生 click事件 vue
@click.native 会触发原生 click事件 vue
- vue组件添加事件@click.native
1,给vue组件绑定事件时候,必须加上native ,否则会认为监听的是来自Item组件自定义的事件 2,等同于在子组件中: 子组件内部处理click事件然后向外发送click事件:$emit(&q ...
- 当使用vue的按键修饰符不起效果的时候怎么办?如@keyup.enter = '' ;
这个问题困扰了我一个多小时,各种测bug !始终测不出来! 直接上代码(错误示范) <el-form-item prop="password"> <el-inpu ...
- ElementUI el-input标签 绑定keyup事件v-on:keyup.enter="convert"无效解决方案
期望实现,输入数字后,回车直接执行点击按钮"转换" 无效写法: <el-input v-model="input" placeholder="请 ...
- element-ui 的input组件 @keyup.enter事件的添加办法
<el-input placeholder="请输入密码" type="password" @keyup.enter.native="login ...
随机推荐
- 快速上手Linux 玩转典型应用_慕课网笔记
1.没有exe安装程序 2.区分大小写 3.一切皆文件 4.文件后缀不是那么重要,只是为了好识别 -------------------------------------------------- ...
- POJ 1061 BZOJ 1477 Luogu P1516 青蛙的约会 (扩展欧几里得算法)
手动博客搬家: 本文发表于20180226 23:35:26, 原地址https://blog.csdn.net/suncongbo/article/details/79382991 题目链接: (p ...
- LCS,LIS,LCIS
网站:CSUST 8月3日(LCS,LIS,LCIS) LCS: 以下讲解来自:http://blog.csdn.net/yysdsyl/article/details/4226630 [问 ...
- eclipse实现批量修改文件的编码方式
http://blog.csdn.net/haorengoodman/article/details/38493007 在eclipse+MyEclipse环境下,打开一个jsp文件,经常发现汉字无法 ...
- asp.net--OnAuthorization方法
我看别人可以通过这个方法中的 Context.Request.Headers.Authorization对象来调取对象来使用,可是我通过实验尝试不出来,真不知道为什么,这儿留个坑吧 别人的 我的
- Ningx初学
原文地址 1. 到官网下载Ningx 2. 启动 2.1双击nginx.exe图标,可见黑窗口一闪而过,启动完毕. 2.2 命令行到nginx目录,输入nginx启动.(注,此方式命令行窗口无任何提示 ...
- vue-自定义组件传
项目中,我们经常会遇到自定义组件传值的问题,方法很多种,但是原理很简单,下述文档总结实际项目中使用的传值方式. 父组件传递给子组件某一值,子组件内会修改该值,然后父组件需要获取新值 在 Vue 中 ...
- 【LeetCode OJ 136】Single Number
题目链接:https://leetcode.com/problems/single-number/ 题目:Given an array of integers, every element appea ...
- Odoo(OpenERP)开发实践:数据模型学习
作者:苏州-微尘 Odoo中,在Python类里定义的模型及字段信息,可在系统中直接查看.为用户开启技术特性权限后,就可以通过菜单 [设置->技术->数据结构->模型] 进入列表视图 ...
- findContours 轮廓查找
物体的轮廓勾勒出了物体的整体形状,物体形状的边界像素一起组合成了轮廓. 灰度图像边界的明显特征是边界两侧灰度级的突变,根据这个特征,使用Sobel.拉普拉斯或Canny之类的边缘检测算子可以有效的检测 ...