怎么理解hook

是什么

HOOK是能在函数组件中“钩入”React 特性的函数。

为什么

为什么会引入hook?

有哪些常用hook

useState

  1. const [num, setNum] = useState(1)

useState返回一个数组,此处是一个数组解构
Q:

useEffect()

useEffect可以让我们在函数组件中进行一些带有副作用的操作

第一个参数: 是个函数

  1. useEffect的入参是一个函数。React 会保存入参的函数,并在执行Dom更新后调用它。

    1. useEffect(()=>{
    2. console.log('useEffect')
    3. )
    4. //这两种写法是一样的
    5. useEffect(effectTest)
    6. function effectTest(){
    7. console.log('useEffect')
    8. }
  2. hook使用了JS的闭包机制。(❓)

  3. useEffect 会在每一次渲染后和每一次更新后执行(如上的默认情况下)。

    第一个入参的返回函数,只在组件卸载时执行

    第二个参数:[] 为空时

    第二个参数:[] 有值时