javascript - 在 KnockoutJS 中，是否有必须声明计算值的特定顺序？

Question

当我运行下面的代码时，我收到了 javascript 运行时错误。 Uncaught TypeError: Cannot read property 'name' of null 在访问 self.dep2().name 时 dep3。

如果我将 dep2 的声明移动到 dep1 的声明之上，错误就会消失。这是 Knockout 中的错误还是我做错了什么？在我看来，由于 dep1 在 dep2 重新计算之前发生了变化，因此正在重新计算 dep3 但我希望 Knockout 能够来处理这种情况。

function ViewModel () {
    var self = this;

    self.root = ko.observable(null);

    self.dep1 = ko.computed(function () {
        return self.root() ? self.root().prop1 : null;
    });

    self.dep2 = ko.computed(function () {
        return self.root() ? self.root().prop2 : null;
    });

    self.dep3 = ko.computed(function () {
        if (self.dep1()) {
            return self.dep2().name;
        }
    });
}

globalViewModel = new ViewModel();

globalViewModel.root({
    prop1: {name: "ThisIsPropOne"},
    prop2: {name: "thisIsPropTwo"}
});

Answer 1

您对评估依赖关系的方式是正确的。对 root 的更改将触发 dep1 和 dep2 重新计算，但对 dep1 的更改会触发 dep3 首先。

在这种情况下，一种选择是限制 dep3，例如:

self.dep3 = ko.computed(function () {
    if (self.dep1()) {
        return self.dep2().name;
    }
}).extend({ throttle: 1 });

否则，请在此处查看 Michael Best 的延迟更新插件:https://github.com/mbest/knockout-deferred-updates ，这将以比节流更稳健的方式正确处理此问题。