自定義Hook函數(shù)

概念:自定義Hook是以use打頭的函數(shù),通過自定義Hook函數(shù)可以用來實現(xiàn)邏輯的封裝和復(fù)用

例:元素顯示隱藏

// 自定義Hook
function useToggle(){
  const [show, setShow] = useState(true)
  const toggle = () => setShow(!show)
  return {
    show,
    toggle
  }
}
const {show,toggle}= useToggle()
<div className="App">
      {show&&<div>一個元素</div>}
      <button onClick={toggle}>顯示/隱藏</button>
</div>

ReactHook使用規(guī)則(useState、useEffect、自定義Hook、、、)

  1. 只能在組件中或者自定義Hook函數(shù)中調(diào)用
  2. 只能在組件的頂層調(diào)用,不能嵌套在if,for,其他函數(shù)中
?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請聯(lián)系作者
【社區(qū)內(nèi)容提示】社區(qū)部分內(nèi)容疑似由AI輔助生成,瀏覽時請結(jié)合常識與多方信息審慎甄別。
平臺聲明:文章內(nèi)容(如有圖片或視頻亦包括在內(nèi))由作者上傳并發(fā)布,文章內(nèi)容僅代表作者本人觀點,簡書系信息發(fā)布平臺,僅提供信息存儲服務(wù)。

相關(guān)閱讀更多精彩內(nèi)容

友情鏈接更多精彩內(nèi)容