寝ても覚めてもこんぴうた

プログラム書いたり、ネットワーク設計したり、サーバ構築したり、車いじったり、ゲームしたり。そんなひとにわたしはなりたい。 投げ銭は kyash_id : chidakiyo マデ

onInputがInputEventではなく、Event型だったのでvalueを取ろうとするとエディタに怒られてハマった話

最近 TypeScript をわからないながらよちよち書いてますが、タイトルの通りで、 onInput イベントで処理を書きたいと思ったら、 event.target.value を触ろうとするとVSCodeに怒られて困っていたので調べた。

結論

結論としては以下に書かれているように、 onInput は InputEvent ではなく、 Event 型で返ってくるため、 value が型的に見えない(取れないわけじゃない)という理由っぽい

why the onInput is type 'Event' not 'InputEvent', can get e.target.value · Issue #234 · vuejs/babel-plugin-jsx · GitHub

対応方法

実際には event.target.value に値は入っているので、

(e.target as HTMLInputElement).value

などのように型を変換して触ってあげればVSCode様の逆鱗から逃れられるようだ。

TypeScriptはかっちりしているようでそうでもないみたいな雰囲気がなかなか馴染めなくて苦戦中。 またなにか覚えたら書きます。