The above error occurred in the <componentName> componentエラーが発生した

The above error occurred in the InputForm(コンポーネント名 component　エラー解決について

エラーの意味

上記のエラーはInputForm（コンポーネント名）で発生しました。

問題の原因

propsを受け取る際の定義の仕方でオブジェクトの分割代入ができていなかった。
⇒プロパティを取り出すところで配列の書き方をしていた。

エラーが発生する原因になっている箇所

InputForm.jsx

 const [studyContentForm, studyTimeForm]=props;

画面を表示しているファイル

App.jsx

const [studyContent, setStudyContent] = useState("");
const [studyTime, setStudyTime] = useState("");
return (
    <>
    <InputForm studyContentForm={studyContent}/>
    <InputForm studyTimeForm={studyTime}  />
    </>
  );

エラー解決策

• コンポーネントをpropsで受け取り時にオブジェクトの分割代入をするときには｛｝の中にpropsのプロパティを入れる必要がある。

InputForm.jsx

const {studyContentForm, studyTimeForm}=props;

Appファイルは上記のファイルと同じため省略します。

さいごに

今回は正しくオブジェクトを分割代入できていなかったことによりエラーが発生したので
エラー発生時にはまず始めに正しい書き方ができているかを確認した方がよいと感じた。