自定义钩子 (Hooks)

React 课程的一部分

你写过一个能开能关的抽屉面板。三行 useState，加一个把布尔值翻过来的处理函数。接着下拉菜单也是同一套，弹窗又是同一套，「显示更多」链接还是同一套。现在有四个组件装着同样的六行代码，等你决定这个开关还应该记住上一次的状态，就得四处全改一遍，然后漏掉一处。

解决办法是自定义钩子 (hook)，而它远没有名字听起来那么玄。它就是一个普通的 JavaScript 函数，名字以 use 开头，并在内部调用 React 自带的钩子。定义就这么多。没有特殊语法，不用注册，也不需要从 React 里导入什么东西来声明它。它的用处是给一段牵涉到状态的可复用行为起个名字，就跟你把任何重复逻辑抽成函数是一回事。