debounceTime не ограничивает вызовы API - PullRequest
Новая
       7

debounceTime не ограничивает вызовы API

0 голосов
/ 04 февраля 2019

У меня есть этот код: 

await commuteReportService.getAddresses(query).pipe(debounceTime(1000))
            .subscribe((response: AddressesAPIResponse) => {
                console.log('execute call', response);
            });

Однако на вкладке сети я все еще вижу, что все запросы отправляются.Этот код используется в компоненте автозаполнения, где я хочу ограничить количество отправляемых вызовов.Я использую rxjs 5.5, React и Typescript.

1 Ответ

0 голосов
/ 04 февраля 2019

debounceTime применяется только к тому, что последует за ним, то есть это относится только к вашей подписке, а не getAddresses(query), где я предполагаю, что вы делаете звонки.

Считайте, что это минимальноепример: 

// html
<input type="text" id="example" />

// js
const input = document.getElementById('example');

Rx.Observable
  .fromEvent(input, 'keyup')
  .map(v => {
    console.log('called')
    return v.target.value;
  })
  .debounceTime(500)
  .subscribe(val => {
    console.log(`Debounced: ${val}`);
  });

Даже если Debounced... задерживается, вы все равно увидите, что called регистрируется на консоли при каждом нажатии клавиши.Если мы изменим порядок 

// js
Rx.Observable
  .fromEvent(input, 'keyup')
  .debounceTime(500)
  .map(v => {
    console.log('called')
    return v.target.value;
  })
  .subscribe(val => {
    console.log(`Debounced: ${val}`);
  });

Теперь и Debounced..., и called задерживаются ( Вот скрипка для кода выше ).

...