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

无效写法:

<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. C# BASS音频库 + 频谱基本用法

    效果图: 使用了 BASS.dll.  BASS.NET.dll   和  PeakMeterCtrl.dll 前面两个负责播放   最后一个负责绘制频谱,本文重点讲的是频谱部分,播放音频部分注意一点 ...

  2. JS反爬绕过思路之--谷歌学术镜像网链接抓取

    首先,从问题出发: http://ac.scmor.com/ 在谷歌学术镜像网收集着多个谷歌镜像的链接.我们目标就是要把这些链接拿到手. F12查看源码可以发现,对应的a标签并不是我们想要的链接,而是 ...

  3. Map-->HashMap练习(新手)

    //导入的包.import java.util.*;//创建的一个类.public class zylx1 { //公共静态的主方法. public static void main(String[] ...

  4. python高阶函数&异常处理

    高阶函数 1.什么是高阶函数 在Python中,变量可以指向函数 函数名也是变量 既然变量可以指向函数,函数的参数能接收变量,那么一个函数就可以接收另一个函数作为参数,这种函数就称之为高阶函数. ma ...

  5. Natas19 Writeup(Session登录,常见编码,暴力破解)

    Natas19: 提示,与上一题源码类似,只是PHPSESSID不连续.随便输入username和password,抓包观察PHPSESSID,发现是输入的信息,按照id-username的格式,由a ...

  6. MyBatis框架——缓存机制

    使⽤缓存机制的作⽤也是减少 Java 应⽤程序与数据库的交互次数,从⽽提升程序的运⾏效率. ⽐如第 ⼀次查询出某个对象之后,MyBatis 会⾃动将其存⼊缓存,当下⼀次查询同⼀个对象时,就可以直接从 ...

  7. Web的服务器和Javaweb结构

    上一节介绍了Eclipse中集成Tomcat环境搭建及javaweb项目的创建,下面说说什么是web服务器及javaweb的结构. 1.web应用的演变 1.1 b/s与c/s模式 B/S:Brows ...

  8. AAAI 2020 | DIoU和CIoU:IoU在目标检测中的正确打开方式

    论文提出了IoU-based的DIoU loss和CIoU loss,以及建议使用DIoU-NMS替换经典的NMS方法,充分地利用IoU的特性进行优化.并且方法能够简单地迁移到现有的算法中带来性能的提 ...

  9. cisco应用

    1.修改VLAN show arp:查看设备的ip地址和mac地址的对应关系,一般查看的是设备ARP缓存 show mac-address-table:查看各端口所学习到的MAC show ip ar ...

  10. JavaScript(9)--- 跨域

    JavaScript(9)--- 跨域 一.跨域原理(同源策略) 在项目搭建的初期,因为现在项目基本上都是前后端分离,所以不可避免地会遇到跨域问题,而造成跨域的罪魁祸首就是浏览器的同源策略.所以要解决 ...