8

RxJS は、重複するボタンのクリックを 2 秒間抑制するのに完全に適合するはずだと思います。ただし、実装に苦労しています。

var $button = $('#myButton').button();
$button
    .toObservable("click")
    //.Throttle(2000) // Wouldn't fire the first event instantly :-(
    .Subscribe(function(){ alert('clicked'); });

便宜上、jsFiddle を既に作成しています。CDN が見つからなかったため、Rx を内部に貼り付けただけなので、このフィドルを下にスクロールする必要があります。

http://jsfiddle.net/cburgdorf/mUMFA/2/

4

5 に答える 5

5

Sergeyの回答をJavaScriptに変換しましたが、これが最終的な方法だと思います。

var $button = $('#myButton').button();
    $button
        .toObservable("click")
        .Take(1)
        .Merge(Rx.Observable.Empty().Delay(2000))
        .Repeat()
        .Subscribe(function(){ console.log('clicked'); }

私の理解では、このソリューションは、構成可能性の点でさらに優れた副作用に依存していないため、実際には優れています。

Sergey が指摘したように、さらに進んで次のように独自のコンビネータを実装することもできます。

Rx.Observable.prototype.OneInTime = function(delay){
 return this
        .Take(1)
        .Merge(Rx.Observable.Empty().Delay(delay))
        .Repeat();
};

したがって、上記の例は次のように縮小できます。

var $button = $('#myButton').button();
    $button
        .toObservable("click")
        .OneInTime(2000)
        .Subscribe(function(){ console.log('clicked'); });
于 2011-03-07T18:51:10.070 に答える
3

これは、RxNet で行う方法です (申し訳ありませんが、RxJS に精通していないため、そこで可能かどうかはわかりません)。

    public static IObservable<T> SupressDoubleClicks<T>(
        this IObservable<T> source, TimeSpan delay)
    {
        return source
            .Take(1)
            .Merge(Observable.Empty<T>().Delay(delay))
            .Repeat();
    }
于 2011-03-06T01:19:32.173 に答える
2

実際、Rx チームの Matthew はとても親切で、Twitter 経由で回答を送ってくれました 。

したがって、できることは次のとおりです。

var $button = $('#myButton').button();
$button
    .toObservable("click")
    .Do(function(){ 
        alert('clicked'); 
        $button.button('disable'); 
    })
    .Delay(2000)
    .Do(function(){ $button.button('enable'); })
    .Subscribe();

http://jsfiddle.net/cburgdorf/mUMFA/5/

ただし：運動上の理由から。有効/無効を設定せずに、最初の発生から2秒間イベントを抑制するだけで機能させたいと思います

大理石のスピーチでは、私はこれを探しています:

O ストリーム: X---X---X---X---X---X---X

Rxストリーム: X------------X------------X

于 2011-03-04T18:47:03.633 に答える
0

私はこのスレッドから多くのことを学びましたが、実際にはクレイジーでデリシャスなイテレーションは群を抜いてクリーンです。しかし、変換された Sergeys answerのように、作成可能なイベント ストリームを返したかったのです。そこで私の方法は…

Rx.Observable.prototype.throttleOnFirst = function(ms){

    var subject = new Rx.Subject();

    var throttler = this
        .do(function(data){subject.onNext(data)})
        .take(1)
        .delay(ms)
        .repeat()
        .subscribe()

    return subject;
};

私のは角度があるので、このように使用します...

var goToChaseTrigger = $scope.$createObservableFunction('goToChase');
var throttleAfterFirst = goToChaseTrigger
    .throttleOnFirst(2000)
    .subscribe(function(d){console.log('throttleOnFirst>',d)})
于 2014-12-12T20:08:15.797 に答える
0

めちゃくちゃ美味しい！

わかった：

var $button = $('#myButton').button();
$button
    .toObservable("click")
    .Do(function(){ console.log('clicked'); })
    .Take(1)
    .Delay(2000)
    .Repeat()
    .Subscribe()
于 2011-03-05T21:05:42.193 に答える