useToggle
管理布尔状态,并提供稳定的操作函数来切换或直接设置状态。
useToggle(initialValue?: boolean): readonly [boolean, (next?: ToggleUpdater) => void]公开 API / 37 个 Hook
按使用场景、分类或 TypeScript 签名查找 Hook,并查看完整的行为说明与源码。
找到 37 个 API 入口。
管理布尔状态,并提供稳定的操作函数来切换或直接设置状态。
useToggle(initialValue?: boolean): readonly [boolean, (next?: ToggleUpdater) => void]管理布尔状态,并提供 setTrue、setFalse 和 toggle 三个明确的操作函数。
useBoolean(initialValue?: boolean): UseBooleanResult用同一个稳定的 setter 同时支持受控和非受控状态。
useControllableState<T>(options?: UseControllableStateOptions<T>): readonly [T | undefined, SetValue<T>]读取上一次完成提交时的值。
usePrevious<T, U = undefined>(value: T, initialValue?: U): T | U | undefined返回一个稳定的 ref,始终指向最近一次完成提交的值。
useLatest<T>(value: T): RefObject<T>保持回调引用稳定,同时调用最近一次提交的实现。
useMemoizedFn<T extends (...args: never[]) => unknown>(fn: T): T提供在组件卸载后会忽略更新的 React 状态。
useSafeState<S>(initialState: S | (() => S)): UseSafeStateResult<S>增加稳定的 reset 操作,将状态恢复为首次解析得到的初始值。
useResetState<S>(initialState: S | (() => S)): UseResetStateResult<S>管理有边界的数字,并提供稳定的增加、减少、设置和重置操作。
useCounter(initialValue?: number, options?: UseCounterOptions): UseCounterResult用稳定的不可变操作管理只读 Map 快照。
useMap<K, V>(initialValue?: MapInitializer<K, V>): UseMapResult<K, V>用稳定的成员操作管理只读 Set 快照。
useSet<T>(initialValue?: SetInitializer<T>): UseSetResult<T>输入停止变化并经过指定延迟后,再更新输出值。
useDebounce<T>(value: T, options: DebounceOptions): T限制输出值的更新频率,每个时间窗口最多更新一次。
useThrottle<T>(value: T, options: ThrottleOptions): T为函数调用添加防抖,并提供 cancel、flush 和 pending 状态。
useDebounceFn<Args, Result>(fn: (...args: Args) => Result, options: DebounceFnOptions): DebouncedFunction<Args, Result>限制函数调用频率,并始终执行最近一次完成提交的回调。
useThrottleFn<Args, Result>(fn: (...args: Args) => Result, options: ThrottleFnOptions): ThrottledFunction<Args, Result>延迟一段时间后执行一次最新回调,并支持取消和读取等待状态。
useTimeout(callback: () => void, delay: number | null, options?: UseTimeoutOptions): { cancel: () => void; pending: boolean }以声明式方式按固定间隔执行最新回调。
useInterval(callback: () => void, delay: number | null, options?: UseIntervalOptions): void运行可中止的异步任务,避免旧结果覆盖较新的状态。
useAsync<T>(task: AsyncTask<T>, options?: UseAsyncOptions): UseAsyncResult<T>防止异步或同步操作并发执行。
useLockFn<Args extends readonly unknown[], Result>(fn: (...args: Args) => Result | PromiseLike<Result>, options?: UseLockFnOptions): LockFn<Args, Awaited<Result>>管理浏览器 WebSocket,提供原始消息、稳定操作和有界自动重连。
useWebSocket(url: string | URL | null, options?: UseWebSocketOptions): UseWebSocketResult订阅 EventTarget,自动推断 Window 事件类型并在需要时清理监听器。
useEventListener(target?, type, listener, options?: UseEventListenerOptions | boolean): void当用户在目标元素之外按下指针时调用处理函数。
useClickOutside<T extends HTMLElement>(ref: RefTarget<T>, onOutside: (event: PointerEvent) => void, enabledOrOptions?: boolean | UseClickOutsideOptions): void通过共享的外部状态源订阅媒体查询结果。
useMediaQuery(query: string, options?: MediaQueryOptions): boolean通过共享的 resize 监听器跟踪视口尺寸。
useWindowSize(): Readonly<{ width: number; height: number }>每个浏览器上下文只用一对监听器跟踪 navigator 的联网状态。
useOnline(): boolean通过共享的外部状态订阅跟踪文档可见性。
useDocumentVisibility(options?: UseDocumentVisibilityOptions): VisibilityState匹配按键候选、谓词,以及 ctrl+s 形式的字符串组合键。
useKeyPress(keyFilter: KeyFilter, handler: KeyPressHandler, options?: UseKeyPressOptions): void跟踪目标的鼠标进入与离开状态,并跟随 ref 目标变化。
useHover(target?: HoverTarget, options?: UseHoverOptions): boolean复制文本并提供可观察状态,同时防止过期写入结果覆盖新状态。
useCopyToClipboard(options?: UseCopyToClipboardOptions): UseCopyToClipboardResult用统一的 API 管理受控或非受控文本输入。
useInput(options?: UseInputOptions): UseInputResult将类型安全的状态同步到 localStorage,并返回序列化错误。
useLocalStorage<T>(key: string, initialValue: T | (() => T), options?: StorageOptions<T>): UseStorageResult<T>将类型安全的状态同步到当前标签页的 sessionStorage。
useSessionStorage<T>(key: string, initialValue: T | (() => T), options?: StorageOptions<T>): UseStorageResult<T>返回一个稳定函数,用来判断组件是否已经完成挂载。
useIsMounted(): () => boolean在浏览器中使用 useLayoutEffect,在 SSR 环境中改用 useEffect。
useIsomorphicLayoutEffect: typeof React.useEffect提供稳定的 ref,在卸载清理阶段变为 true。
useUnmountedRef(): RefObject<boolean>跟踪元素或 ref 的交叉状态,并提供确定性的 SSR 快照。
useIntersectionObserver(options?: UseIntersectionObserverOptions): IntersectionObserverState; useIntersectionObserver(target: IntersectionObserverTarget, options?: Omit<UseIntersectionObserverOptions, 'target' | 'ref'>): IntersectionObserverState通过 ResizeObserver 跟踪元素尺寸,并提供稳定的尺寸状态与清理。
useResizeObserver(options?: UseResizeObserverOptions): ResizeObserverState; useResizeObserver(target: ResizeObserverTarget, options?: Omit<UseResizeObserverOptions, 'target' | 'ref'>): ResizeObserverState