react 的 hooks

1、useState使用状态

const [num,setNum] = useState(5)
定义一个响应式数据num默认值是5，定义个设置num的方法setNum

2、useEffect使用副作用

01、作用

模拟生命周期，监听数据变化

02、模拟挂载完毕

useEffect(()=>{
   // 挂载完毕
},[])

03、模拟卸载前

useEffect(()=>{
  return ()=>{ //模拟卸载前}
},[])

04、模拟某个数据的更新前和更新完毕

useEffect(()=>{
   //count更新完毕
   return  ()=>{// count更新前}
},[count])

05、

副作用中的函数访问的state的值是默认值
如果使用第二个参数[count]，访问的值是count更新后的的最新值

3、useRef使用dom引用

const myref = useRef()
<input ref={myref}/>
myref.current.value 访问input的值

4、所有的hooks都只能在函数组件中使用

5、自定义hooks

本质上普通的函数结合 hooks返回一些可以用的数据