为什么用react-hook
在组件之间复用状态逻辑很难
可能你会使用render props或者高阶组件，但一方面，组件结构需要变动，使用render props和高阶组件也会使组件变得很难理解，另一方面会形成嵌套地狱，在用devtools排查问题时，很不方便。
复杂组件变得难以理解
在此之前，我们可能要关注各种生命周期（虽然也写过一篇react生命周期的文章），componentDidMount，componentDidUpdate等等。举自己曾经在实际项目中的两个例子：
- componentDidMount里面发了n个请求，componentWillRecieveProps里面做了判断后，又发请求。
- componentDidMount添加了addEventListener，componentWillUnmount去removeEventListener。
- 如果1和2再混在同一个组件里面
想想，如果不是自己写的代码，去理解比较困难，其次，如果突然你去维护这样的代码，可能一不小心就把分散在其他地方的业务逻辑忘掉了，导致出现bug，就要背锅了。
难以理解的 class
不止一次面试中问别人，以及被问过，react组件中constructor内绑定事件，箭头函数，bind绑定事件，都是怎么回事，就巴拉巴拉开始说，constructor只执行一次，箭头函数this是指向上下文的，bind每次都会重新生成函数什么什么的。
再者，可能还要区分什么可以写成无状态组件，负责UI，什么组件要用Component，什么组件要用PureComponent。
异步执行，性能更好
与 componentDidMount 或 componentDidUpdate 不同，使用 useEffect 调度的 effect 不会阻塞浏览器更新屏幕，这让你的 应用看起来响应更快。大多数情况下，effect 不需要同步地执 行。
使用多个 Effect 实现关注点分离
使用 Hook解决 class 中生命周期函数经常包含不相关的逻辑，但又把相关逻辑分离到了几个不同方法中的问题。
Hook是什么？
就是以 use 开头的一系列函数，可以让我们在函数当中使用state其他的react特性。不得不感慨前端更新太快，做前端好难，不过还是要不断学习进步，知晓设计的初衷，知晓怎么用，再知晓其原理，干，就对了。
常用的官方hook API
useState
待补充
useEffect
待补充
useEffectLayout
待补充
useRef
待补充
useCallback
待补充
useMemo
待补充
结语
有人就说了，官方的 hook 那么少，写代码还要自己封装很多自定义的 hook 。不得不说，世界上大佬那么多，为什么人家那么聪明，还比我们努力。
想了解更多 hook ，请看下篇: