正文從這開始~
當我們不在事件處理常式中為事件宣告型別時,會產生"Parameter 'event' implicitly has an 'any' type"錯誤。為了解決該錯誤,顯示地為event
引數宣告型別。比如說,在input
元素上,將處理change
事件宣告型別為React.ChangeEvent<HTMLInputElement>
。
這裡有個範例用來展示錯誤是如何發生的。
// App.tsx
function App() {
// ⛔️ Parameter 'event' implicitly has an 'any' type.ts(7006)
const handleChange = event => {
console.log(event.target.value);
console.log(event.target);
};
return (
<div>
<input onChange={handleChange} type="text" id="message" />
</div>
);
}
export default App;
範例中的問題在於,我們沒有顯示地為事件處理常式的event
引數宣告型別。
為了解決該錯誤,我們必須根據事件型別為引數設定一個型別。
// App.tsx
function App() {
const handleChange = (event: React.ChangeEvent<HTMLInputElement>) => {
console.log(event.target.value);
console.log(event.target);
};
return (
<div>
<input onChange={handleChange} type="text" id="message" />
</div>
);
}
export default App;
我們將事件的型別宣告為React.ChangeEvent<HTMLInputElement>
,因為我們正在為input
元素宣告一個onChange
事件。
你要找出事件的型別,最簡單的方法是將事件處理器內聯編寫,並將滑鼠懸浮在函數的event
引數上。
// App.tsx
function App() {
//