Документация для общего "строкового" синтаксиса TS - PullRequest
Новая
       5

Документация для общего "строкового" синтаксиса TS

0 голосов
/ 30 апреля 2018

Этот синтаксис компилируется и работает как задумано: 

window.addEventListener("keydown", this.handlerKeyDown, false);
...
this.handlerKeyDown = (evt => {
        let ke = evt as KeyboardEvent;
        console.log("handlerKeyDown saw", ke.key);            
        return false;
    });

но для этого требуется приведение к KeyboardEvent.

Я заметил, что при наведении курсора на метод addEventListener подсказка говорит 

(method) Window.addEventListener<"keypress">(type: "keypress", 
listener: (this: Window, ev: KeyboardEvent) => any, 
options?: boolean | AddEventListenerOptions | undefined): void (+1 overload)

Я бы действительно предпочел строго типизированную подпись, которая не требует приведения, но у меня был черт времени на поиск документации для этого синтаксиса.

Пытаясь угадать, я замечаю, что синтаксис Window.addEventListener<"keypress">( не расстраивает мой компилятор, но я не могу понять, что он хочет для лямбда-выражения, определяющего слушателя.

Может кто-нибудь объяснить это примером или предоставить правильные условия поиска?

Одна из вещей, которые меня озадачивают, это то, как контролировать, будет ли событие уничтожено. Определение для EventListener 

interface EventListener {
    (evt: Event): void;
}

В ответе Басарата я пытался указать более сильную подпись, но это было несовместимо с интерфейсом EventListener, поэтому я искал определение, уже опубликованное выше.

Воодушевленный тем, что Басарат придумал точно такой же подход, я попробовал это 

    this.handlerKeyDown = (ke: Event | KeyboardEvent) => {
        if (ke instanceof KeyboardEvent) {
            console.log("handlerKeyDown saw", ke.key);
            if (this.router && ke.key === "Esc") {
                this.router.navigateBack();
            }
            return true;
        }
    };

, который больше не расстраивает компилятор, но это не является огромным улучшением приведения.

1 Ответ

0 голосов
/ 30 апреля 2018

Я бы действительно предпочел строго типизированную подпись, не требующую приведения

Добавить аннотацию: 

this.handlerKeyDown = (evt: KeyboardEvent => {

Подробнее

Компилятор выведет его, если он у вас встроен: 

window.addEventListener("keydown", (e /* type will be inferred */) => {});
...