これを自分のKeyboardEventで実行したいだけです

var tag = evt.target.tagName.toLowerCase();

Event.targetはEventTargetタイプですが、Elementから継承しません。だから私はこのようにキャストする必要があります：

var tag = (<Element>evt.target).tagName.toLowerCase();

これはおそらく、一部のブラウザが標準に従っていないためです。TypeScriptでのブラウザに依存しない正しい実装は何ですか？

PS：私は、jQueryを使用してKeyboardEventをキャプチャしています。

Elementすべてのイベントターゲットが要素であるわけではないため、継承しません。

MDNから：

要素、ドキュメント、ウィンドウは最も一般的なイベントターゲットですが、XMLHttpRequest、AudioNode、AudioContextなどの他のオブジェクトもイベントターゲットにすることができます。

KeyboardEvent使用しようとしているものでも、DOM要素またはウィンドウオブジェクト（および理論的には他のもの）で発生する可能性があるためevt.target、として定義しても意味がありませんElement。

それがDOM要素のイベントである場合、私はあなたが安全に仮定できると言いますevt.target。ですElement。これはブラウザ間の動作の問題ではないと思います。単にそれEventTargetよりも抽象的なインターフェースですElement。

さらに読む：https : //typescript.codeplex.com/discussions/432211

typescriptを使用して、自分の関数にのみ適用されるカスタムインターフェイスを使用します。使用例。

  handleChange(event: { target: HTMLInputElement; }) {
    this.setState({ value: event.target.value });
  }

この場合、handleChangeは、HTMLInputElementタイプのターゲットフィールドを持つオブジェクトを受け取ります。

後でコードで使用できます

<input type='text' value={this.state.value} onChange={this.handleChange} />

より明確なアプローチは、インターフェースを別のファイルに置くことです。

interface HandleNameChangeInterface {
  target: HTMLInputElement;
}

その後、次の関数定義を使用します。

  handleChange(event: HandleNameChangeInterface) {
    this.setState({ value: event.target.value });
  }

私のユースケースでは、handleChangeの唯一の呼び出し元は、入力テキストのHTML要素タイプであることが明確に定義されています。

JLRisheの答えは正しいので、イベントハンドラーでこれを使用します。

if (event.target instanceof Element) { /*...*/ }

Typescript 3.2.4

プロパティを取得するには、ターゲットを適切なデータ型にキャストする必要があります。

e => console.log((e.target as Element).id)

あなたは拡張し、独自の汎用インタフェースを作成することができますEvent。このようなもの？

interface DOMEvent<T extends EventTarget> extends Event {
  target: T
}

その後、次のように使用できます。

handleChange(event: DOMEvent<HTMLInputElement>) {
  this.setState({ value: event.target.value });
}

typescriptを使用すると、次のように型エイリアスを利用できます。

type KeyboardEvent = {
  target: HTMLInputElement,
  key: string,
};
const onKeyPress = (e: KeyboardEvent) => {
  if ('Enter' === e.key) { // Enter keyboard was pressed!
    submit(e.target.value);
    e.target.value = '';
    return;
  }
  // continue handle onKeyPress input events...
};

@Bangonkaliは正しい答えを提供しますが、この構文はより読みやすく、ちょうど良いように見えます：

eventChange($event: KeyboardEvent): void {
    (<HTMLInputElement>$event.target).value;
}