2023年8月16日解決済み

ソースコードの 53 行目と 57 行目のonSubmit は名前は同じですが意味は全く違う、と考えてよいでしょうか。

ユーザー

onSubmit 属性について頭の中が混乱しており、確認のため質問します。

53 行目の onSubmit

props.onSubmit(title);

57 行目の onSubmit

<form onSubmit={handleSubmit}>

この2つの onSubmit は名前は同じですが意味は全く違う、と考えてよいでしょうか。

53 行目の方は App コンポーネントの中で <AddForm /> に対してつけた onSubmit 属性を、
AddForm コンポーネントの方で props を介して呼び出している、と理解しています。

それに対して57行目の onSubmit がよくわかっておりません。
JavaScript でいう AddEventListener() の設定と同じことをしていると考えていいでしょうか。

つまり、ボタンをクリックしたときの設定として button 要素に onClick 属性をつけるのと同じように、入力フォームを送信したときの設定として form要素に onSubmit 属性をつけている、ということでしょうか。

同じ onSubmit という名前を使っているので混乱しているだけだと思うのですが確信できないので質問しました。上記の認識で間違っていたらご指摘お願いします。

スタッフ

この回答を見るにはプレミアムプランへの登録が必要です

プレミアムプランとは?