编程 Javascript

vue使用element-ui的el-input监听不了回车事件的解决方法

Posted in Javascript onJanuary 12, 2018

原因

今天在使用element-ui时，el-input组件监听不了回车事件，如下代码没有想要的效果：

<el-input class="search-input" placeholder="请输入内容" v-model="searchText" @keyup.enter="search()"></el-input>

原因应该是element-ui自身封装了一层input标签之后影响了事件的监听，在element-ui里有很多因为自身封装了几层标签导致事件和样式无法按想要的效果呈现，遇到后可以在网页中查看dom结构分析原因。

解决

在事件后面加上.native：

<el-input class="search-input" placeholder="请输入内容" v-model="searchText" @keyup.enter.native="search()"></el-input>

总结

以上所述是小编给大家介绍的vue使用element-ui的el-input监听不了回车事件的解决方法，希望对大家有所帮助，如果大家有任何疑问请给我留言，小编会及时回复大家的。在此也非常感谢大家对三水点靠木网站的支持！

vue使用element-ui的el-input监听不了回车事件的解决方法

- Author -

无所事事者爱嘲笑

声明：登载此文出于传递更多信息之目的，并不意味着赞同其观点或证实其描述。

Javascript 相关文章推荐

关于图片验证码设计的思考

Jan 29 Javascript

javascript 模拟点击广告

Jan 02 Javascript

更优雅的事件触发兼容

Oct 24 Javascript

JS实现图片预加载无需等待

Dec 21 Javascript

js css+html实现简单的日历

Jul 14 Javascript

Vue.js每天必学之过滤器与自定义过滤器

Sep 07 Javascript

Angular和百度地图的结合实例代码

Oct 19 Javascript

微信小程序开发之视频播放器 Video 弹幕弹幕颜色自定义实例

Dec 08 Javascript

深入浅析Vue.js中 computed和methods不同机制

Mar 22 Javascript

JavaScript中click和onclick本质区别与用法分析

Jun 07 Javascript

vue-test-utils初使用详解

May 23 Javascript

vue中渲染对象中属性时显示未定义的解决

Jul 31 Javascript

微信小程序实现的涂鸦功能示例【附源码下载】

Jan 12 #Javascript

js 索引下标之li集合绑定点击事件

Jan 12 #Javascript

简单的Vue SSR的示例代码

Jan 12 #Javascript

详解如何在react中搭建d3力导向图

Jan 12 #Javascript

关于axios不能使用Vue.use()浅析

Jan 12 #Javascript

Vuex 进阶之模块化组织详解

Jan 12 #Javascript

动态Axios的配置步骤详解

Jan 12 #Javascript

You might like

PHP操作mysql函数详解，mysql和php交互函数

2011/05/19 PHP

PHP中最容易忘记的一些知识点总结

2013/04/28 PHP

php调用shell的方法

2014/11/05 PHP

PHP+MYSQL中文乱码问题

2015/07/01 PHP

Javascript 面向对象编程（一）封装

2011/08/28 Javascript

JavaScript中number转换成string介绍

2014/12/31 Javascript

使用JQuery FancyBox插件实现图片展示特效

2015/11/16 Javascript

javascript实现2016新年版日历

2016/01/25 Javascript

JS+Canvas绘制时钟效果

2020/08/20 Javascript

bootstrap表格分页实例讲解

2016/12/30 Javascript

javascript设计模式之中介者模式学习笔记

2017/02/15 Javascript

node实现的爬虫功能示例

2018/05/04 Javascript

angular 实时监听input框value值的变化触发函数方法

2018/08/31 Javascript

JS 事件机制完整示例分析

2020/01/15 Javascript

微信小程序学习总结（四）事件与冒泡实例分析

2020/06/04 Javascript

Vue 打包的静态文件不能直接运行的原因及解决办法

2020/11/19 Vue.js

python socket网络编程步骤详解(socket套接字使用)

2013/12/06 Python

Python中对元组和列表按条件进行排序的方法示例

2015/11/10 Python

Django中login_required装饰器的深入介绍

2017/11/24 Python

python矩阵转换为一维数组的实例

2018/06/05 Python

详解python实现识别手写MNIST数字集的程序

2018/08/03 Python

详解Appium+Python之生成html测试报告

2019/01/04 Python

详解python 3.6 安装json 模块(simplejson)

2019/04/02 Python

一个可以套路别人的python小程序实例代码

2019/04/09 Python

python 中如何获取列表的索引

2019/07/02 Python

python统计字符的个数代码实例

2020/02/07 Python

python利用Excel读取和存储测试数据完成接口自动化教程

2020/04/30 Python

雅诗兰黛旗下专业男士保养领导品牌：Lab Series

2017/05/15 全球购物

俄罗斯品牌服装和鞋子在线商店：BRIONITY

2020/03/26 全球购物

JVM是一个编译程序还是解释程序

2012/09/11 面试题

房地产开发计划书

2014/01/10 职场文书

2014年党员整改措施范文

2014/09/21 职场文书

先进班组事迹材料

2014/12/25 职场文书

工作犯错保证书

2015/05/11 职场文书

2015年妇幼卫生工作总结

2015/05/23 职场文书

大学生创业计划书

2019/06/24 职场文书