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

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

使用箭頭函數上的回調用法作為道具

使用箭頭函數上的回調用法作為道具

拉風的咖菲貓 2022-09-29 16:46:45
我對下面的代碼感到困惑<Signup onClick={() => {}} />然后在注冊組件中,我看到了 useCallback 的用法,如下所示const Signup = ({onClick}) => {   const handleClick = useCallback((e) => {e.preventDefault();},[e])   return <a onClick={handleClick}>signup</a>}使用回調的意圖是什么?難道不能只是const Signup = ({onClick}) => <a onClick={(e) => e.preventDefault();onClick()}>signup</a>
查看完整描述

1 回答

?
喵喵時光機

TA貢獻1846條經驗 獲得超7個贊

的主要目的是,在父組件的每次呈現時,它不會創建對與舊函數完全相同的函數的新引用。創建此新引用將意味著舊函數和新函數不相同 - 即使它們執行相同的操作,這會導致渲染。useCallback

在渲染中,它仍然是對相同函數的相同引用(假設它的依賴項沒有更改)。因此,依賴于此函數的任何內容都不會重新評估(即,如果它是 組件的依賴項,則為組件的 prop 等)。useCallbackuseEffectuseMemo

因此,在示例案例中,只有在更改時才會重新呈現。但除此之外,這很好。SignuponClick

在您的示例中, 將始終重新呈現,因為只要父級重新呈現,函數 to 將始終是新引用。需要明確的是,在函數中還應該使用 useCallback 來使我說的都是正確的。SignuponClick<Signup onClick={() => {}} />() = {}

我看過很多關于如何額外處理和不值得的文章,只有當你知道它會創造好處時,你才應該使用它。這在學術上是100%正確的。但根據我的謙遜經驗,不使用它會導致重新渲染,有時會導致復雜組件中的無限循環。如果我不確定,我會使用它。如果我更聰明,我肯定會猜到。但是當我知道我不需要它時,我不會使用它。(相反,我只在我知道我需要它時才使用它)useCallbackuseMemouseEffectuseCallback


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

添加回答

舉報

0/150
提交
取消
微信客服

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

幫助反饋 APP下載

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

公眾號

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