5

mousewheelRxJS-DOM を使用してイベントを監視し、最初のイベントが発生したときにそれを転送してから、後続の値の間の遅延が以前に指定された期間を経過するまですべての値をドロップするようにします。

私が想像している演算子は次のようになります。

Rx.DOM.fromEvent(window, 'mousewheel', (e) => e.deltaY)
.timegate(500 /* ms */)

次のデータ ストリームを想像してください。

0 - (200 ms) - 1 - (400ms) - 2 - (600ms) - 3

ここで、送信される値は数値であり、時間は次の値が到着するまでの時間を表します。0 が最初の値であるため、それが出力され、その後の値の間の個々の遅延が より大きくないため、3 までのすべての値が削除されます500ms。

スロットルとは異なり、値間の時間遅延は、最後に受信した値が発行されたかどうかに関係なく計算されます。スロットルを使用すると、0 が送信され、200 ミリ秒が経過し、1 が評価されて失敗し、400 ミリ秒が経過し、2 が評価されて合格になります。これは、最後に送信された値 (0) と現在受信されている値 (2 ) は 600 ミリ秒ですが、私のオペレーターでは、1 に対して相対的に評価され、経過時間は 400 ミリ秒になるため、テストに失敗します。

また、この演算子はデバウンスでもありません。発行する間隔が経過するまで待機する代わりに、最初の値を送信してから、将来のすべての値に対して評価を行います。

このようなオペレーターはすでに存在しますか？そうでない場合は、どうすれば作成できますか？

4

2 に答える 2

1

@ user3743222の回答よりも似ているがより洗練されたもので問題を解決しました：

const events = Rx.Observable.fromEvent(window, 'mousewheel', (e) => e.deltaY);
const firstEventObservable = events.take(1);
const remainingEventsObservable = events.skip(1)
    .timeInterval()
    .filter(x => x.interval >= this.props.delayDuration)
    .map(x => x.value);
const pageChangeObservable = firstEventObservable.concat(remainingEventsObservable);
于 2016-05-20T03:03:03.173 に答える