概念

自定义Hook核心就是复用逻辑的一个函数，它又几个特点：

1. 名称以use开头
2. 可以调用其他的Hook
3. 封装可复用的逻辑状态
4. 在每个组件实例都有独立的状态

我封装过哪些自定义Hook呢

useQueue

“在我当前的项目中，由于后端算力资源有限，无法支持多个用户同时发起大模型流式请求，所以我们需要在前端实现一个智能排队控制机制。

我的做法是封装了一个自定义 Hook，叫 useQueue。它的核心思想是：在用户发送消息之前，先向后端发起一个轻量级的‘排队检查’请求。

如果后端返回‘允许直接发送’，我们就立刻放行；如果返回‘需要排队’，我们会拿到两个关键信息：当前排队人数和预估等待时间，然后在前端弹出一个友好的等待弹窗。

与此同时，Hook 会启动一个可取消的轮询，持续监听排队状态。一旦轮到用户，弹窗自动关闭，消息继续发送；如果用户中途点击‘取消’，我们会通过 AbortController 立即中断轮询，并丢弃这次发送。

整个过程对上层组件是透明的——调用方只需要 await useQueue().enqueue()，成功就发消息，失败就处理取消或错误。这样既保护了后端资源，又保证了良好的用户体验，避免用户反复点击或以为系统卡死。”

useLog

这个就比较简单了，目的是在记录用户在不同页面的痕迹，写的一套带有调用后端记日记接口的公用逻辑。

在里面会获取路由 来 调用接口保存日志。有的页面如果带点击按钮跳转的也要记录。所以通过在useLog里返回的addLog函数来执行。