JavaScriptからTypeScriptへの変換時にバインド要素でエラーが出る

Question

#JavaScriptからTypeScriptへの変換

練習の一環でJavaScriptで書かれたコードをTypeScriptに変換しています。
ですが、onClickでエラーが出てしまい、解決できず困っています。
エディタはVSCodeです。

エラー内容は
バインド要素 'onClick' には暗黙的に 'any' 型が含まれます。ts(7031)'
です。

const PlusBtn = ({ onClick }) => (
  <button onClick={ onClick }>+</button>
);

PlusBtn.propTypes = {
  onClick: PropTypes.func.isRequired,
};

###試したこと
以下のように変数に型を追加しても同様のエラーが発生しました。

var onClick:number;

宜しくお願いいたします。

Answer 1

PlusBtnに対して型情報を付与してあげれば問題なく動くと思いますよ。

interface PlusBtnProps {
  onClick: () => void; // こちらはご自身でonClickの型に合わせて修正してください。
}

const PlusBtn: React.FC<PlusBtnProps> = ({ onClick }) => (
  <button onClick={onClick}>+</button>
);

Comments

[kuro_5656]

型情報を付与したら無事エラーが消えました。ありがとうございます。