useIdle

跟踪页面上的用户是否处于空闲状态。

useIdle 通过监听 mousemove、mousedown、keydown、touchstart、resize 和 wheel 等 DOM 事件来检测用户不活动状态。它返回一个布尔值，表示用户是否已闲置超过指定的时间（默认 60 秒）。你可以自定义超时时间、初始状态和重置闲置计时器的事件。

使用场景

• 当用户离开时自动保存草稿或暂停开销大的操作
• 为安全敏感的应用显示”你还在吗？“的提示
• 在一段不活动时间后调暗 UI 或暂停媒体播放

注意事项

• SSR 安全：在服务端渲染期间返回 initialState 值（默认 false）。服务端不会附加事件监听器。
• 可配置事件：默认情况下，hook 在 window 上监听鼠标、键盘、触摸、调整大小和滚轮事件。你可以通过 events 参数覆盖事件列表。
• 相关 hooks：参见 usePageLeave 了解检测光标离开页面视口的方法。

Usage

function Demo() {
  const isIdle = useIdle(3e3);

  return (
    <div>
      <div>用户是否空闲: {isIdle ? "是的 😴" : "不是"}</div>
    </div>
  );
};

API

UseIdle

Returns

boolean: 是否处于空闲

Arguments