我有一個頁面嘗試提交表單：
import React from 'react';
import Form from 'react-bootstrap/Form';
import { useSignIn } from '../../hooks/Auth/useSignIn';
import { useHistory } from 'react-router-dom';
...
function SignIn() {
const { mutateAsync, error, isError, isLoading } = useSignIn();
const history = useHistory();
const handleSubmit = async (event: Event) => {
event.preventDefault();
const data = new FormData(event.target);
const email = data.get('email')!;
const password = data.get('password')!;
await mutateAsync({ email, password });
history.push('/dashboard');
};
return (
<Form onSubmit={handleSubmit} className='py-3'>
<Form.Group controlId='email'>
<Form.Label>Email</Form.Label>
<Form.Control type='email' name='email' />
</Form.Group>
<Form.Group controlId='password'>
<Form.Label>Password</Form.Label>
<Form.Control type='password' name='password' />
</Form.Group>
...
</Form>
);
}
export default SignIn;
但是，每次我嘗試測驗我的代碼時，onSubmit我的表單部分都會向我拋出以下錯誤：
Type '(event: Event) => Promise<void>' is not assignable to type 'FormEventHandler<HTMLFormElement>'.
Types of parameters 'event' and 'event' are incompatible.
Type 'FormEvent<HTMLFormElement>' is missing the following properties from type 'Event': cancelBubble, composed, returnValue, srcElement, and 7 more.ts(2322)
我該如何解決這個錯誤？我的理論是我必須將我的handleSubmit函式定義為一種FormEventHandler<HTMLFormElement>型別，但我對此不太確定。
uj5u.com熱心網友回復：
正確的型別是event: FormEvent<HTMLFormElement>
找到正確型別的一個好技巧是創建一個表單，使用箭頭函式，并讓 VSCode 自動完成正確的型別。
轉載請註明出處，本文鏈接：https://www.uj5u.com/net/507242.html
標籤：javascript 反应 打字稿