React Hook

---

React Hook作用？

在函数组件里模拟生命周期和状态state。

一、Hook

1.useState 使用状态

const [num,setNum]=useState(10)

2.useEffect 模拟生命周期

1.第一个参数回调函数：模拟组件已经挂载完毕，组件已经更新完毕
2.第一个参数的返回值：模拟组件将要卸载
3.第二个参数：依赖参数

    useEffect(function () {
        var n = localStorage.getItem("num") || 10;
        setNum(n * 1);
        console.log("组件已经更新，组件已经挂载");
        return () => { console.log("组件将要卸载"); }
    }, [num])//[num]为响应num的变化输出

3.useRef 使用dom引用

const inpRef=useRef();
<input ref={inpRef}/>
inpRef.current.value

4.useCallback 使用回调函数