在两个 ViewModels Knockoutjs 之间共享一个 ko.computed

Question

所以我有以下 ko.computed：

  self.grandTotal = ko.computed(function () {
        var total = self.bookBasePrice();

        if (self.TornEdge() == true)
            total += self.TornEdgeCost();

        if (self.LogoStamping() == true)
            total += self.LogoCost();

        return total;
    });

我想在两个 ViewModel 之间共享这个。我有StartViewModel 和UploadViewModel，我使用ko.mapping 动态创建可观察对象，这两个视图模型使用完全相同的grandTotal 计算可观察对象，尽管它们在其他方面有所不同。

有什么好的方法可以做到这一点，我查看了 ko.extenders 但这并不是我想要的。

Answer 1

这似乎是使用继承的好选择，如下所示：

function BaseVM(){
    var self = this;
    self.someValue = ko.observable();
    self.grandTotal = ko.computed(function () {
       return self.someValue()+1; 
    });
}

function Vm1(initValue){
    var self = this;
    self.someValue(initValue);
}

Vm1.prototype = new BaseVM();
Vm1.prototype.constructor=Vm1;



function Vm2(){
    var self = this;
    self.someValue(13); 
}

Vm2.prototype = new BaseVM();
Vm2.prototype.constructor=Vm2;


ko.applyBindings(new Vm1(4),document.getElementById("View1"));
ko.applyBindings(new Vm2(),document.getElementById("View2"));

在这里拉小提琴：

http://jsfiddle.net/luisvsilva/freLc1nd/3/

通常当我在 Javascript 中使用继承时，我会使用这个很棒的 sn-p 形式的 John Resig：

http://ejohn.org/blog/simple-javascript-inheritance/

Answer 2

你可以只使用一个普通的函数。所以：

self.grandTotal = myGrandTotaller;

然后定义那个函数：

function myGrandTotaller(self) {
        var total = self.bookBasePrice();

        if (self.TornEdge() == true)
            total += self.TornEdgeCost();

        if (self.LogoStamping() == true)
            total += self.LogoCost();

        return total;
    }

然后您的文本框的绑定语法将是：

data-bind="value:grandTotal($root)"

我更喜欢组合而不是继承，因为你说过它们是两个非常不同的视图/模型。因此，如果这里没有“is a”关系，我会选择“has a”，即组合。