Question

可能是一个淘汰新手问题。我本周刚开始学习淘汰赛。

我有两个可观测量 - 宽度和高度。这些值最初是通过抓取被点击元素的宽度和高度来设置的，因此不需要对此部分进行计算。问题在于，一旦捕获了初始值，我想保持所有未来更改的宽高比。因此，如果用户更新宽度，我希望根据宽高比（原始宽度/原始高度）更新高度。因此，当用户更改宽度时，高度必须改变，反之亦然。

我已尝试使用订阅者，但这会导致无限循环，因为任何宽度变化都需要更改高度，反之亦然。我已经研究了计算的观察者和扩展者，但我不确定任何一个是正确的答案，尽管这可能是由于我对淘汰赛的经验有限。

如果有必要，我可以提供一些代码，但我想如果可能的话，我会尽量保持这个概念。只是让我指出正确的道路。

感谢您的帮助！

Answer 1

与任何循环依赖相似，您必须打破循环。而不是拥有两个相互依赖的可观察量，使它们依赖于一个或多个共同的可观察量。可以维持该比率的可观察量。

如，

function Proportional (width, height) {
    var _ratio = width / height,
        _width = ko.observable(width),
        _height = ko.observable(height);

    this.width = ko.dependentObservable({ read: _width, write: setWidth });
    this.height = ko.dependentObservable({ read: _height, write: setHeight });

    function setWidth(width) {
        _width(width);
        _height(width / _ratio);
    }
    function setHeight(height) {
        _height(height);
        _width(height * _ratio);
    }
}

function ViewModel(data) {
    var p = new Proportional(data.width, data.height);
    this.width = p.width;
    this.height = p.height;
}

fiddle

可观察量依赖于彼此的价值 - 循环引用

1 个答案: