绝对详细的请看官网：https://react.docschina.org/docs/hooks-intro.html
这里对一些常见的用法和问题进行归纳
为了比较好理解，先说明为什么要弄这个hook
Hook 是 React 16.8 的新增特性。它可以让你在不编写 class 的情况下使用 state 以及其他的 React 特性。在未来甚至可以完全覆盖并替换class的写法。
使用hook的主要作用是为了让组件内的逻辑更加清晰，并且可以通过自定义hook来达到复用逻辑。使组件内的逻辑复用性强，且功能清晰明了。
注意：hook只能使用在函数组件中，class组件不支持，所有hook默认约定名称用use开头
用State Hook代替constructor中的this.state
useState hook函数有一个参数，参数可以是任意值，用来进行数据的定义。并且返回一个数组，数组中有两个对象，第一个是state变量并且把参数值赋予它，第二个是设置这个state变量值的方法，这两个对象的名称可自定义
通过useState 函数我们可以定义多个state数据，但我们应该保证每一个state数据都具有意义，同种意义范围的state数据应该放在同一个state，而不应该拆分成2个state
用Effect Hook来编写副作用逻辑代码，其实就相当于class组件内编写componentDidMount，componentDidUpdate中的代码。对应组件生命周期中的Mount阶段和Update阶段。useEffect同样可以定义多个
useEffect hook函数每次渲染都会执行，所以不管是挂载还是更新都会触发它。useEffect是非阻塞的，所以是异步代码。如果要使用同步的话，请使用useLayoutEffect，这个hook用来进行页面布局
useEffect有两个参数。
第一个是副作用函数，用来编写可能具有副作用的代码。副作用函数还可以返回一个函数对象，这个函数对象用来清除副作用，不用清除副作用则不用返回。清除阶段对应class生命周期中的卸载componentWillUnmount，更新componentWillUpdate
官网的effect运行示意图，进行下一次更新前总会先清除上一次更新带来的副作用
第二个参数是数组（可选），里面传入副作用函数中使用到的数据变量，并且这个变量得具有一定变化的特性，第二个参数主要用于优化，防止进行重复渲染。
eq：这里传入的数组是[count]，count在函数中有使用到，而且count也具有变化性。如果下一次变化后的count与当前的count一样，则不会执行useState来重新渲染。不同则会渲染更新。
利用这个参数我们也可以实现只在挂载时渲染一次，而后更新时不再渲染。相当于把挂载时只执行一次的代码写在componentDidMount ，然后在componentWillUnmount清除代码副作用。实现这个功能并不需要像class组件必须在不同生命周期函数中编写代码，在这里你只需把第二个参数改为一个空数组即可。
这里获取了DOM元素p，写法和API createRef()相似。useRef只能用来保存对象，而没办法通过改变useRef.current中的对象来响应式改变页面
如果父组件想通过ref来控制子组件中的DOM（如何传递ref对象），请使用useImperativeHandle Hook，详情请看https://react.docschina.org/docs/hooks-reference.html#useimperativehandle
hook和生命周期函数一样，必须写在函数最顶层
而且hook不应该被嵌套进条件或者循环语句中
hook只能在函数组件或者自定义hook中被使用，而不能用于普通函数或者class组件中
我们可以将一些重复的逻辑代码，抽离成一个自定义hook，名称必须以use开头
按自身定义的hook顺序进行调用
看得出useState只会在初始化时调用一次，而useEffect每次渲染都会调用。每次setState都会触发更新从而调用useEffect，注意只有setState才会让数据进行响应式更新，直接设置数据并不会让页面进行更新。
原文：https://www.cnblogs.com/chujunqiao/p/11876771.html