Skip to main content

FocusManager

管理 FocusManager TanStack Query 中的焦点状态。

它可用于更改默认事件侦听器或手动更改焦点状态。

其可用方法是：

  • setEventListener
  • setFocused
  • isFocused

focusManager.setEventListener​

setEventListener 可用于设置自定义事件侦听器：

import { focusManager } from "@tanstack/react-query";

focusManager.setEventListener((handleFocus) => {
  // Listen to visibilitychange and focus
  if (typeof window !== "undefined" && window.addEventListener) {
    window.addEventListener("visibilitychange", handleFocus, false);
    window.addEventListener("focus", handleFocus, false);
  }

  return () => {
    // Be sure to unsubscribe if a new handler is set
    window.removeEventListener("visibilitychange", handleFocus);
    window.removeEventListener("focus", handleFocus);
  };
});

focusManager.setFocused​

setFocused 可用于手动设置焦点状态。设置为 undefined 回退到默认的焦点。

import { focusManager } from "@tanstack/react-query";

// Set focused
focusManager.setFocused(true);

// Set unfocused
focusManager.setFocused(false);

// Fallback to the default focus check
focusManager.setFocused(undefined);

Options​

  • focused: boolean | undefined

focusManager.isFocused​

isFocused 可用于获取当前焦点状态。

const isFocused = focusManager.isFocused();