1. 什么是HookComponent？

HookComponent：本质上是一个返回JSXElement的一个React Hook。开发者向Hook传入必要的参数，其内部做一定的业务逻辑处理，最终将需要渲染的JSX元素作为Hook的返回值返回。

2. 为什么要用HookComponent？

HookComponent最大的优点：Hook内部很多逻辑可以封装为函数暴露给外部使用，这是普通的FunctionComponent所不具有的特点。一定程度上提高了代码的可复用性。

3. 既然HookComponent多了这样一个天然的逻辑复用优势，那为什么我们还要大量的使用FunctionComponent呢？

HookComponent的优点也是它致命的缺陷！在某些复杂业务场景下HookComponent的设计者会将其内部封装的逻辑函数暴露给外部使用。从外部来看，这些东西其实是一个黑盒，开发者并不知道它的使用条件，所以大家会随心所欲的去使用，极端情况会导致严重的问题。

4. 总结

虽然在日常开发中大多都使用FunctionComponent，但在某些复杂业务场景下，也不要忘记了HookComponent这种解决方案。如果使用了这种方案，就需要格外注意它的缺陷，尽可能避免不必要的错误出现！