vue element-ui 登录回车事件的问题与解决
element
A Vue.js 2.0 UI Toolkit for Web
项目地址:https://gitcode.com/gh_mirrors/eleme/element
免费下载资源
·
前言:pc端的登录用回车更简单方便,但是element的键盘事件好像只有input可以加,也只能选中才可触发,非常不友好
在网上找到如下解决方法:
<el-button @click.native.prevent="handleLogin" @keyup.enter.native="loginEnter('loginData')">登录</el-button>
加入这段代码:
created(){
var _self = this;
document.onkeydown = function(e){
if(window.event == undefined){
var key = e.keyCode;
}else{
var key = window.event.keyCode;
}
if(key == 13){
_self.loginEnter('loginData');
}
}
}
就可以直接用了:
methods:{
loginEnter(){
// 加入axios代码 ...
}
}
但是今天发现这样好用是好用 但是登录后再次点击回车还会触发此事件 又加入如下代码:
methods:{
loginEnter(){
// 加入axios代码
this.$axios({
}).then(function(result){
// 在请求成功后把document.onkeydown置为undefined
document.onkeydown = undefined;
}).catch(function(err){
})
}
}
GitHub 加速计划 / eleme / element
54.06 K
14.63 K
下载
A Vue.js 2.0 UI Toolkit for Web
最近提交(Master分支:2 个月前 )
c345bb45
6 个月前
a07f3a59
* Update transition.md
* Update table.md
* Update transition.md
* Update table.md
* Update transition.md
* Update table.md
* Update table.md
* Update transition.md
* Update popover.md 7 个月前
更多推荐
已为社区贡献1条内容
所有评论(0)