debounceTime使用Rxjs調用API調用

我想了解rxjs並陷於debounceTime(n /* ms */)實驗中。debounceTime使用Rxjs調用API調用

公共debounceTime（duetime參數：編號，調度程序：調度程序）：可觀察

發射來自源僅在特定時間跨度而不另一個源發射通過後可觀察到的值。

source

我的代碼：

function fakeAPI() { 
    return new Rx.Observable(observer => { 

    const root = 'https://jsonplaceholder.typicode.com' 

    $.ajax({ 
     url: root + '/posts/1', 
     method: 'GET' 
    }).then(function(data) { 
     observer.next(data) 
    }).fail(function(err) { 
     observer.error(err) 
    }) 

    return()=>{ 
     observer.complete() 
     console.log('unsubscribed!') 
    } 
    }) 
} 

const fakeObserver = fakeAPI() 

$('#buttonText').click(()=>{ 

    fakeObserver 
    .debounceTime(10000) 
    .subscribe(() => { 
     return { 
      next(item) { 
      console.log('received: ', item.id) 
      }, 
      error(err) { 
      console.log('error:', err) 
      }, 
      complete() { 
      console.log('completed!') 
      } 
     } 
    }()); 
})

我的期望：即使在給定的時間量的點擊N多，API調用將只進行一次。相反，它似乎等待給定的時間，然後所有的N次點擊都會導致API調用。

我在做什麼錯？

根據文檔，debounceTime（n）應該丟棄之前未決的延遲發射，如果新值到達源。

這裏是一個JSBin link

來源

2016-12-26 Amresh Venugopal

作爲每文檔，debounceTime（n）被假設丟棄以前未決的延遲排放如果新的值到達的源上。

這是真的，但每次點擊：

創建新的訂閱
它調用API
API返回結果
debounceTime等待10秒（什麼都不會發生，因爲fakeObserver發出返回observerable只有一次）
您記錄結果

您需要在點擊轉換可觀察到實現你想要什麼：

Rx.Observable.fromEvent(document.getElementById('buttonText'), 'click')

檢查jsBin

來源

2016-12-26 14:25:02

我不與第4點清楚，我觀察到的是，它（我的代碼）表現完全像延遲（n）。是否因爲如果'.subscribe'調用是通過可觀察的，它將被視爲新訂閱？所以如果我有觀察者觀察API調用值，我是否能夠得到相同的結果？ –

@Amresh Venugopal，請改述，我不明白 –

如果.subscribe調用一次給觀察者，那麼按照我的預期，只有在每N次點擊n次的情況下，debounce（n）纔會工作一次？ –

debounceTime使用Rxjs調用API調用

回答

相關問題