useRateLimitedCallback
函数：useRateLimitedCallback()
ts
function useRateLimitedCallback<TFn, TArgs>(fn, options): (...args) => boolean
function useRateLimitedCallback<TFn, TArgs>(fn, options): (...args) => boolean
定义于：react-pacer/src/rate-limiter/useRateLimitedCallback.ts:59
一个 React 钩子，用于创建回调函数的速率限制版本。 此钩子本质上是 @tanstack/pacer 导出的基本 rateLimiter 函数的包装器， 但针对 React 进行了优化，具有响应式选项和稳定的函数引用。
速率限制是一种简单的“硬限制”方法——它允许所有调用，直到达到限制，然后阻止后续调用，直到窗口重置。与节流或防抖不同，它不会尝试隔开或智能地折叠调用。这可能导致快速执行的爆��，然后是一段所有调用都被阻止的时期。
速率限制器支持两种类型的窗口：
- 'fixed'：一个严格的窗口，在窗口期过后重置。窗口内的所有执行都计入限制，并且窗口在期满后完全重置。
- 'sliding'：一个滚动窗口，允许随着旧执行的过期而执行。这提供了一个更随时间推移更一致的执行速率。
对于更平滑的执行模式，请考虑：
- useThrottledCallback：当您希望执行之间具有一致的间距时（例如 UI 更新）
- useDebouncedCallback：当您想要将快速调用折叠为单个执行时（例如搜索输入）
速率限制主要应用于需要强制执行严格限制的情况，例如 API 速率限制或其他需要对执行频率进行硬性限制的场景。
与 useRateLimiter 相比，此钩子提供了更简单的 API，使其非常适合基本的速率限制需求。但是，它不公开底层的 RateLimiter 实例。
对于需要以下功能的高级用法：
- 手动取消
- 访问执行计数
- 自定义 useCallback 依赖项
请考虑改用 useRateLimiter 钩子。
类型参数
• TFn extends AnyFunction
• TArgs extends any[]
参数
fn
TFn
options
RateLimiterOptions<TFn>
返回
Function
参数
args
...TArgs
返回
boolean
示例
tsx
// 对 API 调用进行速率限制，滑动窗口内每分钟最多调用 5 次
const makeApiCall = useRateLimitedCallback(
(data: ApiData) => {
return fetch('/api/endpoint', { method: 'POST', body: JSON.stringify(data) });
},
{
limit: 5,
window: 60000, // 1 分钟
windowType: 'sliding',
onReject: () => {
console.warn('已达到 API 速率限制。请稍后再试。');
}
}
);
// 对 API 调用进行速率限制，滑动窗口内每分钟最多调用 5 次
const makeApiCall = useRateLimitedCallback(
(data: ApiData) => {
return fetch('/api/endpoint', { method: 'POST', body: JSON.stringify(data) });
},
{
limit: 5,
window: 60000, // 1 分钟
windowType: 'sliding',
onReject: () => {
console.warn('已达到 API 速率限制。请稍后再试。');
}
}
);
