🤖

react+typescript(tsx)にGenericsなアロー関数を書く。

2022/06/04に公開

コード

const foo = <T,>(x: T) => x;

<T,>は何なんだと思いませんか？私は思いました。解説します。

アロー関数をジェネリスクにするとこんな感じです。

const foo = <T>(x: T) => x;

これは通常のtsファイルでは問題ないです。ところがtsxファイルだと下記のエラーが出ます。

JSX element 'T' has no corresponding closing tag.ts(17008)

<T>をタグと勘違いして警告が出ちゃうわけですね。カンマを足すことによりコンパイラーにTがジェネリクスであることを教えてあげるわけです。