Skip to content

useDebouncedRefHistory

带防抖的 ref 历史记录,只在停止变化后保存快照。

函数签名

typescript
function useDebouncedRefHistory<T>(
  source: Ref<T>,
  options?: DebouncedRefHistoryOptions
): {
  history: Ref<T[]>
  undo: () => void
  redo: () => void
  clear: () => void
  canUndo: Ref<boolean>
  canRedo: Ref<boolean>
}

interface DebouncedRefHistoryOptions {
  capacity?: number
  clone?: boolean
  debounce?: number  // 防抖延迟(毫秒),默认 1000
}

参数

参数名类型必填默认值说明
sourceRef<T>-要跟踪的 ref
options.capacitynumberInfinity历史记录容量
options.clonebooleantrue是否深度克隆值
options.debouncenumber1000防抖延迟(毫秒)

返回值

类型说明
{ history, undo, redo, clear, canUndo, canRedo }历史记录控制对象

工作原理

  1. 监听 ref 的变化,但不立即保存
  2. 使用防抖机制:
    • 变化发生时重置定时器
    • 停止变化 debounce 毫秒后才保存快照
  3. 避免记录频繁变化的中间状态
  4. 其他功能与 useRefHistory 相同

适用于频繁变化的输入(如文本编辑),只保存用户停止输入后的状态。