Open6

React+TypeScriptでevent.targetの型が決まらない

kage1020kage1020

onSubmitのイベント型が調べて出てきたものを試しても一向に改善しない.

const handleSubmit = (event) => { // パラメーター 'event' の型は暗黙的に 'any' になります。
  event.preventDefault();
  const values = Object.fromEntries(new FormData(event.target).entries());
  console.log({ values });
}
kage1020kage1020
const handleSubmit = (event: React.FormEvent) => {
  event.preventDefault();
  const values = Object.fromEntries(new FormData(event.target).entries()); // 型 'EventTarget' の引数を型 'HTMLFormElement' のパラメーターに割り当てることはできません。
  console.log({ values });
}
kage1020kage1020
const handleSubmit = (event: React.FormEvent<HTMLFormElement>) => {
  event.preventDefault();
  const values = Object.fromEntries(new FormData(event.target).entries()); // 型 'EventTarget' の引数を型 'HTMLFormElement' のパラメーターに割り当てることはできません。
  console.log({ values });
}
kage1020kage1020
const handleSubmit: React.FormEventHandler<HTMLFormElement> = (event) => {
  event.preventDefault();
  const values = Object.fromEntries(new FormData(event.target).entries()); // 型 'EventTarget' の引数を型 'HTMLFormElement' のパラメーターに割り当てることはできません。
  console.log({ values });
}
kage1020kage1020
const handleSubmit = (event: Event) => {
  event.preventDefault();
  const values = Object.fromEntries(new FormData(event.target).entries()); // 型 'EventTarget | null' の引数を型 'HTMLFormElement | undefined' のパラメーターに割り当てることはできません。
  console.log({ values });
}
kage1020kage1020

結局ダウンキャストしてエラーを回避

const handleSubmit = (event: React.FormEvent<HTMLFormElement>) => {
  event.preventDefault();
  const values = Object.fromEntries(new FormData(event.target as HTMLFormElement).entries());
  console.log({ values });
}