TanStack Pacer React 适配器

如果你在 React 应用中使用 TanStack Pacer，我们建议使用 React 适配器。React 适配器在核心 Pacer 功能的基础上提供了一套易于使用的钩子。如果你想直接使用核心 Pacer 类/函数，React 适配器也会重新导出核心包中的所有内容。

安装

npm install @tanstack/react-pacer

npm install @tanstack/react-pacer

React Hooks

请参阅 React 函数参考以查看 React 适配器中可用的完整钩子列表。

基本用法

从 React 适配器导入特定于 React 的钩子。

tsx

import { useDebouncedValue } from '@tanstack/react-pacer'

const [instantValue, instantValueRef] = useState(0)
const [debouncedValue, debouncer] = useDebouncedValue(instantValue, {
  wait: 1000,
})

import { useDebouncedValue } from '@tanstack/react-pacer'

const [instantValue, instantValueRef] = useState(0)
const [debouncedValue, debouncer] = useDebouncedValue(instantValue, {
  wait: 1000,
})

或者从 React 适配器重新导出的核心 Pacer 类/函数。

tsx

import { debounce, Debouncer } from '@tanstack/react-pacer' // 无需单独安装核心包

import { debounce, Debouncer } from '@tanstack/react-pacer' // 无需单独安装核心包