我知道在香草JavaScript中,我们可以做到:

onclick="f1();f2()"

在ReactJS中做两个函数调用onClick会等价什么?

我知道调用一个函数是这样的:

onClick={f1}

当前回答

功能组件

             <button
                onClick={() => {
                  cancelOrder();
                  handlerModal();
                }}
             >
                Cancel
             </button>

其他回答

您可以简单地将其包装在[]中。这将工作以及在材质UI按钮。

<Button onClick={(event) => [function1(), function2()]}>Click Me</Button>

单击以查看示例代码

单击以查看输出

假设你有一个按钮,你想要执行两个onClick事件, 要显示隐藏的文本和隐藏按钮,只需单击一次。

let a = 'invisible'
  let b = 'visible'
  const [show, setShow] = useState(a)
  const [buttonshow, setButtonShow] = useState(b)

<button onClick={() => {setButtonShow(a); setShow(b)}}>Read More</button>
<p>This text will show after you press the button Read more and Read
more will be hidden from the DOM
</p>

如您所见,匿名函数只返回两个函数。

{setButtonShow(a); setShow(b)}

//不要这样做 函数App() { 回报( < div > <按钮 onClick={() => { console.log('你好'); console.log(的世界); }} > 我是一个按钮 < /按钮> < / div > ); } //这样做 函数App() { 函数fun1() { console.log('你好'); } 函数fun2() { console.log(的世界); } 回报( < div > <按钮onClick = {() = > {fun1 (); fun2();}} >点击< / >按钮 < / div > ); }

功能组件

             <button
                onClick={() => {
                  cancelOrder();
                  handlerModal();
                }}
             >
                Cancel
             </button>

最好的方法:

onClick={() => {f1();f2 ();}}