期望实现,输入数字后,回车直接执行点击按钮“转换”

无效写法:

<el-input v-model="input" placeholder="请在此输入待转换的数值" v-on:keyup.enter="convert">

解决办法,加上.native

<el-input v-model="input" placeholder="请在此输入待转换的数值" v-on:keyup.enter.native="convert">

原因说明:

v-on 监听原生事件

现在在组件上使用 v-on 只会监听自定义事件 (组件用 $emit 触发的事件)。如果要监听根元素的原生事件,可以使用 .native 修饰符,比如:

<my-component v-on:click.native="doSomething"></my-component>

文档跳转

ElementUI el-input标签 绑定keyup事件v-on:keyup.enter="convert"无效解决方案的更多相关文章

  1. 为input标签绑定事件的几种方式

    为input标签绑定事件的几种方式 1.JavaScript原生态的方式,直接复制下面的代码就会有相应的效果 <!DOCTYPE html><html><head> ...

  2. 如何给a标签绑定ajax事件

    <a href="review?action=delete&id=${review.id}&articleId=${review.articleId}"cla ...

  3. 超链接标签绑定JS事件&&不加"javascript:;"导致的杯具

    很久以来,在写Html和JS时,经常会给超链接<a>标签,绑定JS事件. 我们经常看到这样的写法,<a href="javascript:;" onclick=& ...

  4. element-ui <el-input> 注册keyup事件,即键盘enter.

    <template> <!-- 需求:keyup事件一般用在input中,在input框中输入内容,用户点击键盘的enter,执行搜索 --> <div class=&q ...

  5. 给js创建的一个input数组绑定click事件

    <html> <body> <input type="button" name="input[]" value="按钮1 ...

  6. <span> <div> 局部 keydown ,keyup事件。页面部分div $(document) 无效,可能焦点,添加焦点。

    前天改一个bug, js 实现的一个 面板拖拉,左右各两个列表,中间面板画线连接,页面左侧列表选中后,key 事件无效.右侧选中确有效,很奇怪,查看源码,左侧选中后,$(document).on(&q ...

  7. input标签的accept属性、JQuery绑定keyDown事件

    一. input标签的accept属性 当我们上传文件或者注册上传头像时,我们可以一般都是使用: <input type="file" id="my_file&qu ...

  8. 如何用input标签上传多个图片并回显

    本文主要记录如何用input标签和jquery实现多图片的上传和回显,不会涉及后端的交互,大概的效果看图 我们从零来做一个这样的demo 第一步: 我们先完善一下我们的页面,默认的input-file ...

  9. 记录JavaScript中使用keyup事件做输入验证(附event.keyCode表)

    input的blur事件 $("#input-name").blur(function () { var value = $(this).val(); if (value === ...

随机推荐

  1. JS的类

    JS在创建之初不支持类,因为很多开发者为处理类创建了好多代码库,最终导致ES6引入了类. ES5及更早的版本都不支持类,与类最接近的是:创建一个构造器,然后将方法指派到该构造器的原型上.就是原型继承. ...

  2. 认识Nginx

    无论你用浏览器还是APP访问多数网站,到达的第一站就是Nginx. 后来者居上的Nginx 千禧年前后,互联网业务迎来了高速发展,老牌的Web服务器都无法满足高性能.高可靠的市场需求. 一个开源的(遵 ...

  3. 性能测试进阶:(一)性能测试工具Locust

    An open source load testing tool. 一个开源性能测试工具. define user behaviour with python code, and swarm your ...

  4. js 实现字符串的查找和替换

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...

  5. (转)协议森林10 魔鬼细节 (TCP滑窗管理)

    协议森林10 魔鬼细节 (TCP滑窗管理) 作者:Vamei 出处:http://www.cnblogs.com/vamei 欢迎转载,也请保留这段声明.谢谢! 在TCP协议与"流" ...

  6. 代码备份 | 博客侧边栏公告(支持HTML代码)(支持JS代码)

    博客侧边栏公告(支持HTML代码)(支持JS代码) <div id='btnList'> <a class="ivu-btn ivu-btn-primary" h ...

  7. Collection-接口中的方法(新手)

    /* Collection 接口中的方法 ArrayList implements List 数组列表 实现 列表 List extends Collection 列表 继承 数组列表*///导入包. ...

  8. 在linux系统中安装LANMP

    1.安装LANMP步骤 root@kali:~# wget http://dl.wdlinux.cn/files/lanmp_v3.tar.gz #下载 root@kali:~# tar xzvf l ...

  9. springboot集成axis1.4

    1.首先通过axis工具根据wsdl文件生成java代码和wsdd文件 set Axis_Lib=/Users/apple/configuration/axis-1_4/lib //lib文件目录se ...

  10. swagger 报 i.s.m.parameters.AbstractSerializableParameter - Illegal DefaultValue null for parameter type integer java.lang.NumberFormatException: For input string

    解决 方法 添加这两个依赖....别问我有啥子用....我也不知道..能解决问题 <dependency> <groupId>io.swagger</groupId> ...