Question

学习KnockoutJS并打砖墙。为游戏制作计算器。摘要版本如下：

用户输入'neededXp'。每当'neededXp'更新时，数组应重新计算'需要'。

self.neededXp = ko.observable(0);

function calcItem(name, image, xp, level) {
    this.name = name;
    this.level = level;
    this.xp = xp;
    this.need = ko.computed(function() {
        var req = self.neededXp()/this.xp;
        return req;
    });
}

self.calcContent = ko.observableArray([

]);

self.populateFishing = function() { 
self.calcContent.push(calcItem('Shrimp','#',1,10));
self.calcContent.push(calcItem('Sardine','#',5,20));
self.calcContent.push(calcItem('Shark','#',110,76));
self.calcContent.push(calcItem('Sea Turtle','#',38,79));
self.calcContent.push(calcItem('Manta Ray','#',46,81));
    }

目前，它首次完美计算，并且出现当'needXp'更新时，它会使用正确的'neededXp'重新计算所有值，但是每个值都会计算出来。数组中的索引从数组的最后一个成员读取'xp'。

澄清一下，当我更新'needXp'时，所有成员的'需要'都是用 Manta Ray 值中的'xp'重新计算的，而不是它们各自的索引。

可能是非常明显的事情，希望有人可以指导我。

编辑：重新阅读我的代码之后，我想我可以看到为什么正在发生，但我不知道如何修复。我不知道如何保持数组中的'xp'值，如果这是有道理的。

EDIT2：http://jsfiddle.net/sTnY7/ jsfiddle与减小大小的阵列的可用性。点击鱼按钮填充表格，然后将“目标等级”更改为6，以便最简单地演示问题。这就是问题发生的地方 - 所有“#Requiree”从数组的最后一个成员获取XP值并重新计算。如果目标等级为6，则显示102.2 - 例如，“虾”应为511。

希望这是有道理的。

Answer 1

好的 - 所以我自己创造了一个小提琴

http://jsfiddle.net/dD67p/2/

必须做出一些改变 -

范围界定（我怀疑） - calcItem现在看起来像这样：

function calcItem(name, image, xp, level) {
    var self2 = this;
    self2.name = name;
    self2.level = level;
    self2.xp = xp;
    self2.need = ko.computed(function () {
        var req = self.neededXp() / self2.xp;
        return req;
    });

此外，您在创建new个对象并将其推送到calcItem时错过了calcContent。

我将populateFishing更改为

self.populateFishing = function () {
    self.calcContent.push(new calcItem('Shrimp', '#', 1, 10));
    self.calcContent.push(new calcItem('Sardine', '#', 5, 20));
    self.calcContent.push(new calcItem('Shark', '#', 110, 76));
    self.calcContent.push(new calcItem('Sea Turtle', '#', 38, 79));
    self.calcContent.push(new calcItem('Manta Ray', '#', 46, 81));
}

在这个小提琴中更新needXp时，你可以看到绑定数据的变化。

KnockoutJS在ObservableArray中的computedObservable

1 个答案: