jQuery DOM操作来自Knockout ViewModel -使用bindingHandlers？

Question

我有一个很棒的viewModel，它看起来像这样：

function myViewModel() {
    this.update = function() {
        ...
    }
    ...
}

和一个看起来像这样的bindingHandler：

ko.bindingHandlers.myBindingHandler = {
    init: function(element, valueAccessor, allBindings, viewModel) {
        function manipulateDom(element) {
            ...
        }
    }
}

每当调用update方法时，我希望myViewModel调用manipulateDom。

我可以使用bindingHandler中的回调集来完成这个任务：

function myViewModel() {
    this.update = function() {
        ...
        this.myBindingHandlerCallback();
    }
    ...
}

ko.bindingHandlers.myBindingHandler = {
    init: function(element, valueAccessor, allBindings, viewModel) {
        viewModel.myBindingHandlerCallback = manipulateDom.bind(null, element);
    }
}

<div data-bind="myBindingHandler: null"></div>

我的另一个想法是使用可观察到的“updateCount”，并在bindingHandler中订阅它：

function myViewModel() {
    this.updateCount = ko.observable(0);
    this.update = function() {
        ...
        this.updateCount(this.updateCount() + 1);
    }
    ...
}

ko.bindingHandlers.myBindingHandler = {
    update: function(element) {
        manipulateDom(element);
    }
}

<div data-bind="myBindingHandler: updateCount"></div>

这两种解决方案都让人感到脆弱和混乱。解决这类问题的“击倒”方法是什么？我应该只是在viewModel内部操作DOM吗？

我要补充的是，manipulateDom函数有许多逻辑不适用于敲除方式(测量窗口高度、测量DIV高度等)。

谢谢!

Answer 1

第二种方法(使用计数器)要好得多，因为ViewModel不应该通过覆盖它的属性来覆盖和更改ViewModel的行为。

如果您的update方法对其他可观察到的属性做了一些更改，那么我将创建一个计算属性，它将订阅ViewModel的当前状态，并自动调用DOM操作绑定，如果您将它作为绑定参数传递，那么不需要增加计数器或任何其他标志。