我創建了三個組件:<MyInputComponent>擴展了material ui組件<Input><MyInputComponent>通過接受作為 propsonInputTyping并將其傳遞給onChangeof來處理 onChange of<MyInputComponent><App>渲染并<Input>傳遞onInputTyping給<Input>函數handleTypying代碼: https: //codesandbox.io/s/upbeat-bas-u0rj4內部輸入我有:const Input: React.FC<Props> = (props: Props) => { const { onInputTyping } = props; return ( <MyInputComponent onChange={(event) => onInputTyping && onInputTyping(event)} /> );};內部應用程序我有:export default function App() { const handleTyping = (event: React.ChangeEvent<HTMLInputElement>) => { console.log(event.target.value); }; return ( <div className="App"> <Input onInputTyping={(event) => handleTyping(event)} /> <br /> <Input onInputTyping={() => handleTyping(event)} /> <-- This still console.log the event, but why? <br /> <Input onInputTyping={handleTyping} /> <-- This still console.log the event, but why? </div> );問題: 我不明白為什么<Input>里面的最后兩個App能夠console.log用戶鍵入的事件。event我在第一個中傳遞了only Input,然后event將其傳遞給handleTyping。例子:<Input onInputTyping={(event) => handleTyping(event)} />但在第二個和第三個中,<Input>我不會將任何傳遞event給handleTyping. handleTyping那么,即使我沒有event向它傳遞任何內容,怎么可能能夠 console.log(event) 呢?
React 句柄更改功能無需參數事件即可工作
侃侃爾雅
2023-12-14 16:40:21