常用的hook

一、 为什么引入Hook?
hooks中的自定义Hook使得可以不修改组件的结构的基础上，灵活的复用组件逻辑。
class组件不能很好的压缩，并且热重载不稳定。不利于组件优化。使用Hook的函数组件不存在这些问题

二、Hook的规则
1、只能在函数组件中使用hooks 类组件中无效。
2、只能在函数最外层使用不能用于if，for等语句中，也不能用于普通js函数中。因为ReactHook通过调用顺序确定对应的state等对应的hook方法。使用语句等会改变顺序。
3、只能在以名字use开头的自定义Hook中使用

三、常用的hook
1、 useState
接受一个参数作为初始值，参数可以是常量，也可以是一个返回值的函数。
初始值如果是一个函数，在初次渲染执行；如果是一个函数的执行，每次渲染都会执行
这个是定义值的 里面能直接给值 也能写逻辑 需要的时候里面写一个函数 写一些需要的逻辑最后返回一个最终值即可

2、useEffect
它相当于是componentDidMount,componentDidUpdate,componentWillUnMount三个生命周期的合成体。
它接受两个参数， 第一个是一个函数（effect），第二个参数可选，是一个数组（第一个函数中用到的可变数据集合）。

useEffect(() => {
   
  document.title = `You clicked ${
     count} times`;
}, [count]); // 仅在 count 更改时更新；每次渲染，第一个函数都相当于一个新生成的函数

3、useContext
使函数组件可以具有和Class组件中的contextType属性（使可以通过this.context访问值）一样的功能。
用法和Class中contextType基本一致。接受一个context对象作为参数，返回最近的Provider提供的值。

const ThemeContext = React.createContext('dark');<