如何立即触发某些东西然后去抖动

Question

我有一个可观察绑定到输入框上的事件 keyUp。

每按下一个键。我要console.log'Do something now'.

如果 5 秒内没有按键，那么我想 console.log 'Do something else'

import { fromEvent } from 'rxjs';
import { debounceTime, map, switchMap } from 'rxjs/operators';

const searchBox = document.getElementById('search');

const keyup$ = fromEvent(searchBox, 'keyup')

keyup$.pipe(
  switchMap((i: any) => 'doSomethingNow'), // I use switchMap here because 'doSomethingNow' is an http request in my real code so that on each key pressed, it cancels the previous http request if it was not finished and start the new http request
  debounceTime(2000),
  map(_ => 'do something else')
)
.subscribe(console.log);

此代码仅在 5 秒后打印 'do something after debounce'，但在按下每个键后从不打印 'domethingNow'

Answer 1

你有没有尝试过类似的东西：

import { fromEvent } from 'rxjs';
import { debounceTime, map, switchMap } from 'rxjs/operators';

var searchBox  = document.getElementById('search');

var keyup$ = fromEvent(searchBox , 'keyup')      

keyup$.pipe(
  switchMap((i: any) => { console.log('do something');})
  debounceTime(5000)) // with delay of 5 secs
  .subscribe(console.log('do something else'););

Answer 2

您可以使用合并运算符：

const searchBox = document.getElementById('search');

const keyup$ = fromEvent(searchBox, 'keyup');

const keyupEnd$ = keyup$.pipe(
  switchMap(() => debounceTime(500))
);

const result = merge(
  keyup$,
  keyupEnd$
);

如何立即触发某些东西然后去抖动

how to trigger something immediately then debounce

rxjs

redux-observable