Reactでセレクトボックス項目の切換の方法

Question

React Hookで、選択項目を切り替えようと思ったのですが、以下のエラーが出ます。

どこが足りないのでしょうか？すみませんがご教授お願いします。

TypeError: Cannot destructure property 'name' of 'e.target' as it is undefined.

  38 | 
  39 | const onChange = (e) => {
  40 |   console.log(e)
> 41 |   const { name, value } = e.target
     | ^  42 |   // const tempDate = { ...publishDate, [name]: value }
  43 |   // const formated = `${tempDate.dateYear}/${tempDate.dateMonth}/${tempDate.dateDay} ${tempDate.dateTime}:${tempDate.dateMinutes}`
  44 |   // setPublishDate({ ...publishDate, [name]: value })

Comments

[hoshi-takanori]

Select の onChange の引数はイベントではなく value なので、e.target が undefined ってことでしょう。
https://ant.design/components/select/#Select-props

[kaoru_tujimiya]

ありがとうございます。その場合どう修正すれば宜しいでしょうか？？

Answer 1

Ant Design の Select props によれば onChange の引数はイベントではなく選択 (または入力) された値なので、e をそのまま value にすればいいと思います。

   const onChange = (e) => {
     console.log(e)
-    const { name, value } = e.target
+    const [name, value] = ['dateMonth', e]
     const tempDate = { ...publishDate, [name]: value }
     // 略

Comments

[kaoru_tujimiya]

ありがとうございます！実行できました。ありがとうございました。