Question

我认为RxJS应该完全适合压制多次按键点击2秒。但是，我正在努力实施。

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

为方便起见，我已经创建了一个jsFiddle。你需要向下滚动这个小提琴，因为我只是在里面粘贴了Rx，因为我找不到CDN。

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

Answer 1

我将Sergeys的答案转换为JavaScript，并认为这应该是最后的方法。

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

根据我的理解，这个解决方案实际上更好，因为它不依赖于副作用，这使其在可组合性方面更加出色。

正如谢尔盖指出的那样，你甚至可以更进一步实施自己的组合器，如下所示：

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'); });

Answer 2

这就是我在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();
    }

Answer 3

实际上，来自Rx团队的Matthew非常友好地通过twitter向我发送答案： http://twitter.com/#!/mattpodwysocki/status/43731812513624064

所以，你可以做的是：

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 Stream：X --- X --- X --- X --- X --- X --- X

RxStream：X ------------ X ------------ X

Answer 4

疯狂好吃！

我明白了：

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

Answer 5

我从这个帖子中学到了很多东西，实际上疯狂美味的迭代是迄今为止最干净的。但我想返回一个可撰写的事件流 - 就像转换后的Sergeys回答一样。所以这是我的方法......

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)})

如何进行首次发生，然后将事件抑制2秒（RxJS）

5 个答案: