如何在knockoutjs中结合限制和订阅?

Gen*_*sky 9 knockout.js

我有一个功能,它与服务器进行一些通信,以报告当前的屏幕几何形状等.

    function sendScreenLayout() { 
        logElementLocations(exp.getPageCoordinates());
    };
Run Code Online (Sandbox Code Playgroud)

我将此函数订阅到我的代码中的一些事件,如下所示:

viewModel.onLayoutChange.subscribe(sendScreenLayout);
$('#right-splitter > #mainContent').resize(sendScreenLayout);
$(window).resize(sendScreenLayout);
...
setTimeout(sendScreenLayout, 1);
Run Code Online (Sandbox Code Playgroud)

其中一些事件可能过于频繁地被发送,以便由服务器有效地处理,我想将请求限制在一些合理的速率.

我能想到的最好的是这样的:

var triggerSend = ko.observable();

ko.computed(function() {
    triggerSend();
    logElementLocations(exp.getPageCoordinates());
}).extend({throttle: 200});

function sendScreenLayout() {
    triggerSend.valueHasMutated();
}
Run Code Online (Sandbox Code Playgroud)

有没有更简洁的方法来捕捉这种模式,或者这是要走的路?

Mic*_*est 10

如果您使用的是Underscore,可以这样使用debounce:

var sendScreenLayout = _.debounce(function() { 
    logElementLocations(exp.getPageCoordinates());
}, 200);
...
$(window).resize(sendScreenLayout);
...
Run Code Online (Sandbox Code Playgroud)

否则,它不是Knockout直接支持的模式.你提出的解决方案似乎已经足够好了,尽管这里有一个替代方案:

var triggerSend = ko.computed({
    read: function() {},
    write: function(dummy) {
        logElementLocations(exp.getPageCoordinates());
    }
}).extend({throttle: 200});

function sendScreenLayout() {
    triggerSend(true);
}
Run Code Online (Sandbox Code Playgroud)