过滤与时间

RxJS debounceTime

每次新值都会重置计时器,只发出静默窗口后的最后一个值。

debounceTime(300)

时间线如何变化

  1. 1
    输入 A

    启动 300ms 静默计时。

  2. 2
    AB 到来

    A 的计时被取消并重新等待。

  3. 3
    ABC 到来

    AB 再次被取消。

  4. 4
    输出 ABC

    静默窗口结束,最后一个值进入输出流。

  5. 5
    输出 ABCD

    下一轮静默窗口结束。

受支持的示例代码

实验室只根据下列示例中的关键操作符生成预设时间线,不执行任意输入代码。

import { fromEvent, debounceTime, map } from 'rxjs'

const search$ = fromEvent(input, 'input').pipe(
  map(event => event.target.value),
  debounceTime(300)
)

search$.subscribe(runSearch)