框架
版本
Debouncer API 参考
Throttler API 参考
速率限制器 API 参考
队列 API 参考
批处理器 API 参考

createThrottledSignal

函数:createThrottledSignal()

ts
function createThrottledSignal<TValue>(value, initialOptions): [Accessor<TValue>, Setter<TValue>, SolidThrottler<Setter<TValue>>]
function createThrottledSignal<TValue>(value, initialOptions): [Accessor<TValue>, Setter<TValue>, SolidThrottler<Setter<TValue>>]

定义于:throttler/createThrottledSignal.ts:41

一个 Solid 钩子,用于创建一个节流状态值,该值在指定的时间窗口内最多更新一次。 此钩子将 Solid 的 createSignal 与节流功能相结合,以提供受控的状态更新。

节流确保状态更新以受控的速率发生,无论设置器被调用的频率如何。 这对于限制昂贵的重新渲染或依赖于快速变化状态的操作的速率非常有用。

该钩子返回一个包含以下内容的元组:

  • 节流状态值访问器
  • 一个遵守配置的等待时间的节流设置器函数
  • 用于附加控制的节流器实例

要更直接地控制节流而不进行状态管理, 请考虑改用较低级别的 createThrottler 钩子。

类型参数

TValue

参数

value

TValue

initialOptions

ThrottlerOptions<Setter<TValue>>

返回

[Accessor<TValue>, Setter<TValue>, SolidThrottler<Setter<TValue>>]

示例

tsx
// 基本节流 - 每秒最多更新一次状态
const [value, setValue, throttler] = createThrottledSignal(0, { wait: 1000 });

// 具有自定义前导/后导行为
const [value, setValue] = createThrottledSignal(0, {
  wait: 1000,
  leading: true,   // 首次更改时立即更新
  trailing: false  // 跳过尾随边缘更新
});

// 通过信号访问节流器状态
console.log('执行次数:', throttler.executionCount());
console.log('是否待处理:', throttler.isPending());
console.log('上次执行时间:', throttler.lastExecutionTime());
console.log('下次执行时间:', throttler.nextExecutionTime());
// 基本节流 - 每秒最多更新一次状态
const [value, setValue, throttler] = createThrottledSignal(0, { wait: 1000 });

// 具有自定义前导/后导行为
const [value, setValue] = createThrottledSignal(0, {
  wait: 1000,
  leading: true,   // 首次更改时立即更新
  trailing: false  // 跳过尾随边缘更新
});

// 通过信号访问节流器状态
console.log('执行次数:', throttler.executionCount());
console.log('是否待处理:', throttler.isPending());
console.log('上次执行时间:', throttler.lastExecutionTime());
console.log('下次执行时间:', throttler.nextExecutionTime());