vue 如何给页面添加enter回车事件？

`主要代码：`

@keyup.enter.native="ajaxLoginApi()"

代码示例：

<el-form ref="form" :model="form" :label-position="labelPosition" label-suffix=":" label-width="100px" status-icon><el-form-item label="手机号码"><el-input v-model="form.username" size="mini" @keyup.enter.native="ajaxLoginApi()"></el-input></el-form-item><div class="tips"></div><el-form-item label="密码"><el-input type="password" v-model="form.pwd" size="mini" clearable  @keyup.enter.native="ajaxLoginApi()"></el-input></el-form-item><div class="tips"></div><div class="tips"></div><div style="margin-top: 10px;margin-left：0"><el-button type="primary" @click="ajaxLoginApi" size="medium">确认登录</el-button><el-button type="" plain size="medium" @click="linkTo('#/register')">立即注册</el-button></div></el-form>

效果图截图：

除了按钮提交，还能在表单校验无误之后，键盘enter回车提交！

以上就是关于 ” vue 给页面添加enter回车事件 - 代码篇 “ 的全部内容。

vue 给页面添加enter回车事件 - 代码篇相关推荐

enter对应的keycode_vue 添加enter回车事件
问题所在:今天遇到一个需求,给el-button组件添加点击事件,之前对这块一直一知半解,所以特此总结一下解决方法: Vue 允许为 v-on 在监听键盘事件时添加按键修饰符,所以对一个普通的Vue ...
element-ui 搜索框组件：监听input键盘事件 - 代码篇
踩坑:vue + element-ui 框架监听input键盘事件 - 含demo演示代码示下: html部分: <el-inputplaceholder="职位 | 地区 | 工作 ...
js获取window窗口高度（页面滚动条可滚动高度） - 代码篇
js中获取窗口高度的方法取窗口滚动条滚动高度 (如下文 · 截图) 一. javascript 和 jquery代码: //原生 javascript 代码: let scrollHeight = ...
Vue —— 登录页面按enter键触发登录按钮事件
如果是用elementui框架中的 el-input 组件,那就可以直接在该组件标签上使用@keyup.enter.native鼠标enter事件如果没有使用vue框架中的组件去写的button登录 ...
chrome插件开发：为页面添加点击事件
目录上面说了些什么? 示例插件示例应用示例插件安装打开开发者模式添加本地插件包安装后的效果插件开发插件介绍目录结构 manifest.json index.html addToke ...
给vue的页面添加背景图片
1.在tempalate下面建设两个div,两个div建设在同一个div内 1 <div class="background"></div> 2 <d ...
vue：添加enter事件，键盘敲下enter事件
vue项目中遇到点击查询按钮可以查出数据,点击回车键也能查出数据,所以就想点击回车键时调用查询方法. 示例代码如下: 一.第一步: 给input按钮绑定@keyup.enter:如果是要对页面的but ...
vue 回车事件失焦事件
在监听键盘事件时,我们经常需要检查常见的键值.Vue 允许为 v-on 在监听键盘事件时添加按键修饰符: <input @keyup.enter="submit"> 在 ...
向SharePoint页面添加后台代码
声明:本文转载在本文中,我将跟大家一起讨论,为MOSS的页面添加服务器端代码的另一种方式.不过首先要声明,这种方式仅作为技术研究,如要使用,请慎重! 在上一篇文章中,我们讨论过如何为MOSS页面添加 ...

vue 给页面添加enter回车事件 - 代码篇

vue 如何给页面添加enter回车事件？

`主要代码：`

代码示例：

效果图截图：

vue 给页面添加enter回车事件 - 代码篇相关推荐

最新文章

热门文章