我正在嘗試獲取此函式引數的正確型別
const handleInputChange = ({ target }) => {
setFormValues({
...formValues,
[target.name]: target.value,
});
};它向我拋出了一個沒有使應用程式崩潰的錯誤，但我知道這不是一個好習慣。
為了提供更多背景關系，所有正在更改的欄位都是字串。
uj5u.com熱心網友回復：
它告訴你，因為你沒有告訴它引數的型別是什么。
你需要告訴它型別是什么。有幾種方法：
鍵入您要分配函式的常量；或者
直接輸入引數
鍵入您要為函式分配的常量
您可以使用ChangeEventHandler泛型型別來做到這一點，將元素的型別作為型別引數：
import { ChangeEventHandler } from "react";
// ...
const onChange: ChangeEventHandler<HTMLInputElement> = ({currentTarget}) => {
// type ??????^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^
console.log(`${currentTarget.name} => ${currentTarget.value}`);
};
直接輸入引數
該引數是一個具有currentTarget屬性的事件物件，因此如果（例如）在 an 上使用 this ，則HTMLInputElement可以使用 type { currentTarget: HTMLInputElement }：
const handleInputChange = ({ currentTarget }: { currentTarget: HTMLInputElement }) => {
// type ????????????????????????????????????^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^
// ...
};
或者你可以使用ChangeEvent<T>：
import { ChangeEvent } from "react";
// ...
const handleInputChange = ({ currentTarget }: ChangeEvent<HTMLInputElement>) => {
// type ????????????????????????????????????^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^
// ...
};
注意我使用currentTarget而不是target. 它通常不為物質input要素（target和currentTarget始終是相同的，如果處理程式是上input，而不是它的父/祖先），但它確實為button元素和其他一些人（因為target可能是一個后代元素）。如果您處理change父/祖先元素而不是input直接處理，這很重要。
轉載請註明出處，本文鏈接：https://www.uj5u.com/gongcheng/353361.html
標籤：javascript 反应 打字稿