フロントエンジニアになるための奮闘日記 1日目

今日も早起きできたので、アプリ修正をしつつ疲れたら筋トレ!ということができて朝から好調です。

今は、アプリの作成が完了しているので、jsからtsxに変更してtypescriptの記述を加えながらtypescriptについて勉強中です。

今日詰まったところ

  • TypeScriptで document.getElementById("hoge").value をすると出るThe property ‘hoge' does not exist on value of type 'HTMLElement' というエラーが発生してしまう。

  • 配列をfilter関数で出力データを絞った場合に、return値(filterの場合、filter条件の値をreturnするため)と出力データの型が違うため、型エラーになってしまう。

1つ目のTypescriptエラーについて

親要素HTMLElementが持つプロパティを使うべきだが、
今回プロパティとして認識されていないvalueを使ったことが原因でエラーが発生。
こちらに、HTMLElementで使えるプロパティ一覧が載っています。
https://developer.mozilla.org/ja/docs/Web/API/HTMLInputElement

今回valueを使いたいので、valueプロパティが使えるHTMLInputElementを使いました。また、Input要素の操作で利用するインターフェースなので、用途としてもバッチリです!

const element: HTMLInputElement = document.getElementById("inputFile") as HTMLInputElement;
element.value="";

2つ目のエラーは、まだ解消できていないので次回!

この記事が気に入ったらサポートをしてみませんか?