博客
关于我
强烈建议你试试无所不能的chatGPT,快点击我
vue+element Form键盘回车事件页面刷新解决
阅读量:6989 次
发布时间:2019-06-27

本文共 523 字,大约阅读时间需要 1 分钟。

问题描述:如下代码所示,使用element-ui 中的el-form组件对table进行条件查询,当查询条件仅有一项时,使用@keyup.enter.native事件绑定回车事件,出现点击回车后,浏览器会刷新页面的问题;

查询

搜索了问题触发原因,是由于当表单只有一个文本框时,按下回车将会触发表单的提交事件, 导致页面的刷新。

解决方案一:加一个隐藏的文本框,即表单不只有一个文本框,如下:

查询

element官方解决方案:在el-from 加上 @submit.native.prevent

查询

以上两种方案均可解决。

转载地址:http://jdzvl.baihongyu.com/

你可能感兴趣的文章
美拍直播首屏耗时减少50%以上的优化实践
查看>>
一篇文章搞懂 Activity 启动模式
查看>>
你不知道的 Electron (二):了解 Electron 打包
查看>>
Flexbox Guide
查看>>
听说你精通原生JavaScript,来试试这份题目吧
查看>>
蚂蚁金服自主研发的三地五中心异地多活解决方案获金融科技创新大奖
查看>>
junit测试之第三方组件mock
查看>>
sitemesh的script提取
查看>>
玩转iOS开发:iOS 11 新特性《UICollectionView的拖放》
查看>>
原来 JS 还存在这样的拆箱转换
查看>>
读书笔记 | 《Think in Java》Ⅶ 复用类
查看>>
基于比特币现金BCH二层网络能实现区块链2.0以太坊的智能化吗?
查看>>
Android显示框架:Android应用视图的管理者Window
查看>>
[译] JavaScript 如何工作:对引擎、运行时、调用堆栈的概述
查看>>
将 Intent 序列化,像 Uri 一样传递 Intent!!!
查看>>
Vue教程02:v-model、v-text、v-html
查看>>
App Store 狠抓精神文明建设,JSPatch要亡了?
查看>>
专注数据,打造阿里云Elasticsearch“一站式”数据服务体系
查看>>
一文读懂前端缓存
查看>>
script中defer和async的区别
查看>>