1、实现函数

在utils目录下创建tools.ts文件(这里使用的是typescript,用javascript就创建tools.js)

/**
 * @description 文档注册enter事件
 * @param cb
 */
export const handleEnter = (cb: any): void => {
  document.onkeydown = (e: any) => {
    e = window.event || e;
    if (e.keyCode === 13) {
      cb();
    }
  };
};

2、组件内使用

在要使用的组件内按如下代码使用

<el-button type="info" @click="console.log(111)" handleEnter> // 要使用回车的按钮


import { handleEnter } from '@/utils/tools'; // 注册


private created(): void {
    handleEnter(this.xxx); // 按下回车执行的函数
}


private beforeDestroy(): void {
  document.onkeydown = null; // 清除登陆页面的回车事件
}

由于keyCode 被禁用,改写一下函数

/**
 * @description 文档注册enter事件
 * @param cb
 */
export const handleEnter = (cb: any): void => {
  document.onkeydown = (e: any) => {
    e = window.event || e;
    if (e.key === 'Enter') {
      cb();
    }
  };
};

Thank you for your reading!

Logo

前往低代码交流专区

更多推荐