如何在React中將參數傳遞給事件處理器
了解如何傳遞參數給onClick事件處理器,例如,在不在渲染時調用方法的情況下。
當您在React功能性組件上工作時,可能需要將事件附加到onClick(或其他事件)。
通常您會這樣做:
1 | <button onClick={addBill}>添加</button> |
但是如果您需要傳遞參數呢?假設您有一個帳單清單,並且希望通過點擊其旁邊的“X”來刪除其中一個。
您不能這樣做:
1 | <button onClick={removeBill(index)}>𝗫</button> |
因為onClick內部的表達式將在渲染時執行。這會在應用程序啟動時刪除列表中的所有帳單。
相反,這是您需要使用箭頭函數進行的操作:
1 | <button onClick={() => removeBill(index)}>𝗫</button> |