亚洲在线久爱草,狠狠天天香蕉网,天天搞日日干久草,伊人亚洲日本欧美

為了賬號安全,請及時綁定郵箱和手機立即綁定
已解決430363個問題,去搜搜看,總會有你想問的

如何在點擊 ReactJS 時調用兩個箭頭函數

如何在點擊 ReactJS 時調用兩個箭頭函數

開滿天機 2022-10-21 09:33:41
我已經看到很多關于在 React onclick 中調用多個傳統聲明的函數的線程,但我很困惑如何使用箭頭函數來實現它。我有一個名為 handleClose 的函數,它關閉一個 Material UI 菜單:const [open, setOpen] = React.useState(false);const anchorRef = React.useRef(null);const handleClose = (event) => {    if (anchorRef.current && anchorRef.current.contains(event.target)) {      return;    }    setOpen(false);  };我有一個名為 handleModalOpen 的函數,它打開一個 Material UI Modal:const [modalOpen, setModalOpen] = React.useState(false);const handleModalOpen = () => {  setModalOpen(true);};當我單擊此菜單項時,我希望運行這兩個功能。這兩個功能單獨工作正常。那么我將如何實現這一目標?(目前我只設置了它以便打開模式)<MenuItem onClick={handleModalOpen}>Add Album</MenuItem>基本上我有一個觸發菜單的按鈕,然后單擊其中一個菜單選項應該在關閉菜單時觸發模式。此外,這是一個功能組件。
查看完整描述

1 回答

?
心有法竹

TA貢獻1866條經驗 獲得超5個贊

您可以創建一個內聯箭頭函數,它同時調用


<MenuItem onClick={(e) => {handleModalOpen(); handleClose(e); }}>Add Album</MenuItem>

或者你可以在外面創建一個函數并傳遞它的引用


handleClick = (e) => {

  handleModalOpen(); 

  handleClose(e);

}


<MenuItem onClick={handleClick}>Add Album</MenuItem>


查看完整回答
反對 回復 2022-10-21
  • 1 回答
  • 0 關注
  • 177 瀏覽
慕課專欄
更多

添加回答

舉報

0/150
提交
取消
微信客服

購課補貼
聯系客服咨詢優惠詳情

幫助反饋 APP下載

慕課網APP
您的移動學習伙伴

公眾號

掃描二維碼
關注慕課網微信公眾號