如何检测TypeScript中按下的键？

Question

在javascript中以下行的typescript中语义等价的语法是什么

//Some knockout event handler.
myFunc(data : string, evt : Event) {
    //If enter or tab key up were detected add the excuse to the collection.
    if(evt.enterKey || evt.which == 9)
        //Do Something
}

我遇到的麻烦不像常规的javascript事件,typescript事件类没有属性enterKey或which.那么如何在不获取打字稿编译错误和丑陋的红色摇摆下划线的情况下检测哪个键被按下？

Answer 1

您需要使用更专业的事件类型KeyboardEvent,如下所示:

myFunc(data : string, evt : KeyboardEvent)

如果你也想删除错误,evt.enterKey你需要通过扩展接口来添加它 - 虽然我不知道这是一个真正的属性,因为它不是技术的控制键,比如CTRL,SHIFT或者ALT都有属性在活动上:

interface KeyboardEvent {
    enterKey: boolean;
}

Answer 2

您需要注册事件，例如：

class EventHandler {
    static RegisterKeyPress(input: string){
        document.getElementById(input).addListener('keypress', (e: KeyboardEvent) =>{
           //You have yout key code here
            console.log(e.keyCode);
        }
    }
}

快乐编码！

Answer 3

对于React用户

  private onKeyDown = (e: React.KeyboardEvent<HTMLDivElement>) => {
    console.log(e.key)
  }

附加HTMLDivElement元素的类型在哪里onKeyDown。