1、实现函数
在utils目录下创建tools.js文件(我这边用的是JavaScript,用typescript就创建tools.ts文件)
export const handleEnter = (hc) => {
document.onkeydown = (e) => { //按下回车提交
var event = e || window.event;
if (event.keyCode && event.keyCode == 13) {
hc();
} else if (event.which == 13){
hc();
}
};
};
2、组件内使用
在要使用的组件内按照如下代码使用
import { handleEnter } from '@/utils/tools'; //导入js文件
created(){
handleEnter(this.queryBtn) //页面初始化时调用、把查询方法传递进来
}
beforeDestroy(){
document.onkeydown = null; //离开当前路由,会直接调用beforeDestroy方法销毁回车事件
}
只需要四步就可以实现回车查询,不用每个下拉框、输入框都绑定事件