vue中使用事件监听addEventListener()来实现回车登录功能
在开发中需要做一个点击回车按钮来实现登录的功能,使用到事件监听。事件监听addEventListener()用法:(参照文献:菜鸟教程.)addEventListener(event, function, useCapture)参数一event:必须。字符串,指定事件名。注意: 不要使用 “on” 前缀。 例如,使用 “click” ,而不是使用 “onclick”。参数描述event必须。字符串
·
在开发中需要做一个点击回车按钮来实现登录的功能,使用到事件监听。
事件监听addEventListener()用法:(参照文献:菜鸟教程.)
addEventListener(event, function, useCapture)
参数一event:必须。字符串,指定事件名。
注意: 不要使用 “on” 前缀。 例如,使用 “click” ,而不是使用 “onclick”。
参数 | 描述 |
---|---|
event | 必须。字符串,指定事件名。 “onclick”;注意: 不要使用 “on” 前缀。 例如,使用 “click” ,而不是使用 “onclick”。 |
function | 必须。指定要事件触发时执行的函数;当事件对象会作为第一个参数传入函数。 事件对象的类型取决于特定的事件。例如, “click” 事件属于 MouseEvent(鼠标事件) 对象。 |
useCapture | 可选。布尔值,指定事件是否在捕获或冒泡阶段执行。可能值:true - 事件句柄在捕获阶段执行;false- false- 默认。事件句柄在冒泡阶段执行 |
移除事件监听removeEventListener()用法:(参照文献:菜鸟教程.)
使用方法与addEventListener()相同
created () {
// 绑定事件
window.addEventListener('keydown', this.keyDown)
},
methods: {
//登录
onSubmit () {
//登录请求
},
//回车登录
keyDown (e) {
// 如果是回车则执行登录方法
if (e.keyCode === 13) {
this.onSubmit()
}
}
}
// 登录成功后销毁事件
destroyed () {
window.removeEventListener('keydown', this.keyDown, false)
}
这样就可以完成点击回车来执行登录的功能了
更多推荐
已为社区贡献2条内容
所有评论(0)