参考
组件
- ImpressionArea —
ImpressionArea是一个测量特定 DOM 元素在屏幕上可见时长、并在元素进入或离开视口时执行回调的组件。该组件使用useImpressionRefHook 来跟踪元素的可见性。 - Separated —
Separated是一个在各个子元素之间插入指定组件的组件。适合用于在列表中添加分隔符、间距或其他重复出现的元素。 - SwitchCase —
SwitchCase是一个让你根据给定值以声明式方式渲染组件的组件，类似switch-case语句。当你需要根据特定状态条件渲染不同组件时很有用。
Hooks
- useAsyncEffect —
useAsyncEffect是一个用于在 React 组件中处理异步副作用的 Hook。它遵循与useEffect相同的清理模式，同时确保异步操作被安全处理。 - useAvoidKeyboard —
useAvoidKeyboard是一个帮助固定在底部的元素避开屏幕键盘的 React Hook。它返回一个可以应用到position: fixed元素上的 CSS 样式，当键盘出现时平滑地将元素移动到键盘上方。 - useBodyScrollLock —
useBodyScrollLock是一个在组件挂载期间锁定 body 滚动的 React Hook。它会在挂载时自动锁定，并在卸载时自动解锁。它适用于模态框和抽屉等覆盖层组件，这些组件必须防止其后的页面滚动。 - useBooleanState —
useBooleanState是一个简化布尔状态管理的 React Hook。它提供函数来将状态设置为true、设置为false以及切换其值。 - useCallbackOncePerRender —
useCallbackOncePerRender是一个确保回调函数无论被调用多少次都只执行一次的 React Hook。它适用于那些即使组件重复渲染也不应重复执行的一次性操作。 - useConditionalEffect —
useConditionalEffect是一个根据谓词函数条件性地执行 effects 的 React Hook。这让你在 effects 何时运行方面拥有比仅依赖变化更多的控制。 - useControlledState —
useControlledState是一个允许你同时控制受控状态和不受控状态的 React Hook。如果你将状态传给value，它就是受控状态；如果你将状态传给defaultValue，它就是不受控状态。如果同时传入了value和defaultValue，则value优先。 - useCounter —
useCounter是一个管理数值计数器状态、并提供递增、递减和重置能力的 React Hook。你可以选择提供最小值和最大值来约束计数器的范围。 - useDebounce —
useDebounce是一个返回所提供回调函数防抖版本的 React Hook。它通过延迟函数执行并将多次调用合并为一次，帮助优化事件处理。 - useDebouncedCallback —
useDebouncedCallback是一个返回所提供回调函数防抖版本的 React Hook。它通过延迟函数执行并将多次调用合并为一次，帮助优化事件处理。 - useDebouncedValue —
useDebouncedValue是一个返回所给值防抖副本的 React Hook。调用方始终拥有该状态；Hook 只延迟返回值的跟随速度。返回值会在最后一次变化后wait毫秒更新，这适用于从快速变化的状态中推导搜索查询或校验输入。 - useDoubleClick —
useDoubleClick是一个区分单击和双击事件的 React Hook。它会将单击回调的执行延迟指定的一段时间，如果在这段时间内发生了第二次点击（即双击），则取消该回调。 - useGeolocation —
useGeolocation是一个获取并跟踪用户地理位置的 React Hook。它使用浏览器的Geolocation API，同时支持一次性位置获取和持续的定位跟踪。 - useImpressionRef —
useImpressionRef是一个测量特定 DOM 元素在屏幕上可见时长、并在元素进入或退出视口时执行回调的 React Hook。它使用IntersectionObserver和Visibility API来跟踪元素的可见性。 - useInputState —
useInputState是一个管理输入状态并支持可选值转换的 React Hook。返回的onChange处理函数同时适用于<input>和<textarea>元素。 - useIntersectionObserver —
useIntersectionObserver是一个检测特定 DOM 元素是否在屏幕上可见的 React Hook。它使用IntersectionObserverAPI，在元素进入或退出视口时执行回调。 - useInterval —
useInterval是一个按指定时间间隔执行函数的 React Hook。它适用于计时器、轮询数据以及其他周期性任务。 - useIsClient —
useIsClient是一个仅在客户端环境中返回true的 React Hook。它主要用于区分客户端渲染和服务端渲染（SSR）。只有当组件挂载到客户端环境中后，该状态才会被设置为true。 - useIsomorphicLayoutEffect —
useIsomorphicLayoutEffect是一个 React Hook，它在浏览器中运行useLayoutEffect，同时避免在服务端渲染（SSR）期间触发其警告。在 SSR 期间，没有 DOM 可供同步测量或变更，因此在 React 18 及更早版本中，使用useLayoutEffect会触发警告。effect 只会在浏览器中运行。此 Hook 只负责避免警告，不会让服务端输出与客户端保持一致。React 19 不再发出该警告，因此在 React 19 中可以直接使用useLayoutEffect。 - useKeyboardHeight —
useKeyboardHeight是一个跟踪屏幕键盘高度的 React Hook。它返回当前键盘的高度（像素），当键盘出现、消失或改变大小时会自动更新。 - useList — 一个将数组作为状态进行管理的 React Hook。它提供高效的状态管理和稳定的操作函数。 初始状态和
setAll均接受可变数组和只读数组。 - useLoading —
useLoading是一个简化Promise加载状态管理的 React Hook。它提供一个状态来跟踪异步操作是否正在进行，并提供一个函数来自动处理加载状态。 - useLongPress —
useLongPress是一个检测元素被按压并按住指定时长的 React Hook。它同时处理鼠标和触摸事件，使它在桌面和移动设备上都能一致地工作。 - useMap — 一个将键值 Map 作为状态进行管理的 React Hook。它提供高效的状态管理和稳定的操作函数。
- useNetworkStatus —
useNetworkStatus是一个提供 Network Information API 访问权限的 React Hook。它提供原始的网络连接数据，例如连接类型、连接质量、速度以及用户的数据节省偏好。如果该 API 不受支持（例如 Safari、Firefox），每个属性都是undefined。 - useOutsideClickEffect —
useOutsideClickEffect是一个在点击事件发生于指定容器之外时触发回调的 React Hook。它适用于在点击外部时关闭模态框、下拉菜单、工具提示以及其他 UI 组件。 - usePageVisibility —
usePageVisibility是一个检测页面可见性变化的 React Hook。它使用 Page Visibility API 监控用户何时切换标签页或最小化浏览器。它适用于暂停或恢复动画、视频或后台任务，以提升性能并改善用户体验。 - usePreservedCallback —
usePreservedCallback是一个维持回调函数稳定引用、同时确保它始终能访问最新状态或 props 的 React Hook。这可以避免不必要的重复渲染，并在将回调传给子组件或处理事件监听器时简化依赖管理。 - usePreservedReference —
usePreservedReference是一个在值未变化时帮助维持其引用、同时确保你始终能安全使用最新状态的 React Hook。它在避免不必要的重复渲染的同时，始终允许访问最新数据。 - usePrevious —
usePrevious是一个返回输入状态之前值的 React Hook。当发生未伴随状态变化的重复渲染时，它会原样保留之前的值。如果该状态是对象或需要自定义变化检测，则可以提供compare函数。默认情况下，状态变化通过prev === next来检测。 - useRefEffect —
useRefEffect是一个帮助你为特定 DOM 元素设置引用、并在元素变化时执行回调的 React Hook。此 Hook 会在元素变化时调用清理函数，以防止内存泄漏。 - useSafeAreaInset —
useSafeAreaInset是一个跟踪安全区域内边距变化的 React Hook。它返回安全区域的内边距，当屏幕方向变化（例如从竖屏到横屏）时会自动更新。 - useScrollDirection —
useScrollDirection是一个检测滚动方向的 React Hook。它返回滚动方向（向上/向下）和当前的滚动位置。默认进行节流（50ms）以优化性能。 - useSet — 一个将 Set 作为状态进行管理的 React Hook。它提供高效的状态管理和稳定的操作函数。
- useStorageState —
useStorageState是一个功能类似于useState、但会将状态值持久化到浏览器存储中的 React Hook。该值会在页面刷新后保留，并且在配合localStorage使用时可以在标签页之间共享。 - useThrottle —
useThrottle是一个创建回调函数节流版本的 React Hook。它适用于限制函数的调用频率，例如在处理滚动或调整大小事件时。 - useThrottledCallback —
useThrottledCallback是一个返回所提供回调函数节流版本的 React Hook。节流后的回调在指定的时间间隔内最多只会被调用一次。 - useThrottledValue —
useThrottledValue是一个返回所给值节流副本的 React Hook。调用方始终拥有该状态；返回值每wait毫秒至多跟随一次，这适用于用滚动位置、指针位置或元素在调整大小时的尺寸来驱动昂贵的渲染。 - useTimeout —
useTimeout是一个在指定延迟后执行回调函数的 React Hook。它按照 React 生命周期来管理setTimeout，确保在卸载时或依赖变化时执行清理。 - useToggle —
useToggle是一个简化布尔状态管理的 React Hook。它提供函数在true和false之间切换状态。 - useVisibilityEvent —
useVisibilityEvent是一个监听文档可见性状态变化并触发回调的 React Hook。 - useVisualViewport —
useVisualViewport是一个跟踪 Visual Viewport 变化的 React Hook。它返回移动 WebView 中实际可见的区域，当键盘出现或用户缩放、滚动时，该区域会发生变化。
工具函数
- buildContext —
buildContext是一个减少定义 React Context 时重复代码的辅助函数。 - disableBodyScrollLock —
disableBodyScrollLock是一个解除 body 滚动锁定的工具函数。它会恢复被enableBodyScrollLock锁定的滚动，并回到保存的滚动位置。 - enableBodyScrollLock —
enableBodyScrollLock是一个锁定 body 滚动的工具函数。它通过应用固定定位来阻止 body 滚动，在打开模态框、抽屉或其他覆盖层组件时很有用。 - getKeyboardHeight —
getKeyboardHeight是一个返回当前屏幕键盘高度（以像素为单位）的工具函数。 - getSafeAreaInset —
getSafeAreaInset是一个以对象形式返回所有安全区域内边距（以像素为单位）的工具函数。 - isAndroid —
isAndroid是一个检测当前设备是否运行 Android 的工具函数。 - isIOS —
isIOS是一个检测当前设备是否运行 iOS 或 iPadOS 的工具函数。 - isKeyboardVisible —
isKeyboardVisible是一个检查屏幕键盘当前是否可见的工具函数。 - isServer —
isServer是一个判断当前代码是否运行在服务端的工具函数。在window未定义的 SSR（服务端渲染）环境中返回true，在客户端环境中返回false。 - mergeProps —
mergeProps是一个将多个 props 对象合并为单个对象的工具函数。它会处理className、style和function属性的合并。 - mergeRefs —
mergeRefs接收多个 ref（RefObject 或 RefCallback），返回一个能更新所有传入 ref 的单一 ref。当你需要向单个元素同时传递多个 ref 时很有用。当回调 ref 返回清理函数（React 19）时，合并后的 ref 也会返回一个清理函数，并在分离时执行所有清理操作。 - subscribeKeyboardHeight —
subscribeKeyboardHeight是一个订阅屏幕键盘高度变化的工具函数。