javascript - 在某些情况下无法重置属性，vue.js

Question

所以，我在 Vue.js 中有一个“迷你游戏”，让你“战斗”。我试图在有人“死”后让游戏宣布获胜者，然后询问你是否想再玩一次。在那之前一切都很好，但是当我试图让它在你点击你想再次玩，重置你的健康和“怪物”的健康回到 100 时，它就是行不通。这是我的代码，我重置了所有内容，它运行了，我已经放置了控制台日志，但它什么也没做:

checkWinner: function() {
    if(this.mHp <= 0) {
        if (confirm('You won! Play again?')) {
            this.startGame();
        } else {
            this.gameIsActive = false;
        }
        return true;
    } else if (this.pHp <= 0) {
        if (confirm('You lost! Play again?')) {
            this.startGame();
        } else {
            this.gameIsActive = false;
        }
        return true;
    }
    return false;
}

}另外，如果您想看一下，这里是完整的代码。如果有人能向我解释为什么它不起作用，我将不胜感激。提前致谢!

http://jsfiddle.net/y5mn61qf/

Answer 1

问题出在您的 startGame() 函数中，您的 pHp 和 mHp 变量未使用 this< 设置.

你有:

pHp = 100;
mHp = 100;

应该是:

this.pHp = 100;
this.mHp = 100;

我通过使用 console.log() 发现了这一点，它帮助我确定 startGame() 正在触发，然后经过仔细检查让我注意到你的数据未正确更新。