如何在 onClick 事件 ReactJS 中插入 2 個功能？

Question

<Button onClick={submitHandler}>

我有這個按鈕，它已經為它的 onClick 事件分配了 function。 我還想將<Button onClick={() => Toggle()}>這個 Toggle function 添加到同一個按鈕中。 我該怎么做？

Answer 1

只需創建一個調用這兩個函數的 function。 假設submitHandler需要事件 object，它將如下所示：

<Button onClick={(event) => {
  submitHandler(event);
  Toggle();
})}>

Answer 2

如果你想處理你需要做的事件 onClick={(e) => { submitHandler(e); 切換（）； }。

如果您不想處理事件，只需執行 onClick={() => { submitHandler(); 切換（）； }。

Answer 3

首先，考慮分離您的功能，您可以執行以下操作：

<Button onClick={(e) => handleClick}>

然后創建你的函數，它看起來像：

const handleClick = (e) => { handleSubmit(e); handleToggle();}

您可以稍后分開處理每個 function：

const handleSubmit() => { // your code  }
const handleToggle() => { // your code  }