Phaser 事件问题。为什么我的更改解决了它？

Question

为标题道歉，但我希望有人能解释为什么我收到以下错误以及我所做的更改是如何解决它的。

概述：

我正在创建一个游戏，您必须射击 3 个目标才能获胜。如果您击中所有 3 个 HIT 状态，则会加载（因此，如果您未击中所有 3 个 MISS 状态，则会加载）。进入 HIT 状态后，您单击屏幕，然后触发一些游戏逻辑，确定您是否中奖。游戏逻辑是一个 php 脚本，它通过 ajax 运行并返回一个赢或输变量。一旦返回，就会触发状态更改，根据结果将您引导至 WIN 状态或 LOSE 状态。

所有4个状态代码：

命中状态

MyGame.Hit = function () {};
MyGame.Hit.prototype = {
    create: function () {
        this.bgd = this.add.image( 0, 0, 'hitBgd');
        this.bgd.inputEnabled = true;
        this.bgd.events.onInputDown.add( this.gameLogic, this);
    },
    gameLogic: function () {
        var username = 'user';      
        if (typeof username !== 'undefined') {
            var request = new XMLHttpRequest();
            request.open('GET', '_/api/logic.php?user=' + username, true);
            request.onreadystatechange = function () {

            if ((request.readyState === 4) && (request.status === 200)) {
                var returnedData = JSON.parse(request.responseText);
                if (returnedData.outcome === true) { // Winner
                    MyGame.game.state.start('Won');                     
                } else { // Loser
                    MyGame.game.state.start('Lose');
                }
            }           
        }
        request.send();
    } else {
        MyGame.game.state.start('Lose');
    }
}       
};

州小姐：

MyGame.Miss = function () {};
MyGame.Miss.prototype = {   
    create: function (){
        this.bgd = this.add.image( 0, 0, 'missBgd');
        this.playAgainBtn = this.add.button((this.game.width / 2) - 145, 235, 'playAgainBtn', this.playAgain, this);
        this.exitBtn = this.add.button((this.game.width / 2) + 145, 235, 'exitGameBtn', this.exitGame, this);
    },
    playAgain: function () {
        this.state.start('MainMenu');
    },
    exitGame: function () {
        alert('AWAITING LINK FROM CLIENT');
    },
};

获胜状态

MyGame.Won = function () {};
MyGame.Won.prototype = {
    create: function () {
        this.bgd = this.add.image( 0, 0, 'wonBgd');
        this.playAgain = this.add.button(130, 510, 'wonPlayAgainBtn', this.playAgain, this);
        this.exitBtn = this.add.button(395, 510, 'wonExitGameBtn', this.exitGame, this);
    },
    playAgain: function () {
        this.state.start('MainMenu');
    },
    exitGame: function () {
        alert('AWAITING LINK FROM CLIENT');
    }       
};

失去状态

MyGame.Lose = function () {};
MyGame.Lose.prototype = {
    create: function (){
        this.bgd = this.add.image( 0, 0, 'loseBgd');
        this.playAgainBtn = this.add.button((this.game.width / 2) - 145, 235, 'playAgainBtn', this.playAgain, this);
        this.exitBtn = this.add.button((this.game.width / 2) + 145, 235, 'exitGameBtn', this.exitGame, this);
    },
    playAgain: function () {
        this.state.start('MainMenu');
    },
    exitGame: function () {
        alert('AWAITING LINK FROM CLIENT');
    }   
};

你可以看到 MISS、WON 和 LOSE 状态都是一样的，除了在 WON 状态下我的按钮被称为 this.playAgain 而不是 this.playAgainBtn . 第一次中奖没问题，但如果不刷新页面再次玩到HIT状态，触发游戏逻辑并中奖，就会出现以下错误

Uncaught Error: Phaser.Signal: listener is a required param of add() and   should be a Function.

然后它指出 this.playAgain 在我的 WON 状态。

我想知道为什么将其更改为 this.playAgainBtn 会消除错误。我应该破坏事件/信号吗？即使它们处于不同的状态/对象，我是否应该以不同的方式命名我的函数？ 还有为什么我需要调用 MyGame.game.state.start('Won');在 ajax 请求中而不是 this.state.start('Won');切换状态？

当它上线并调整几率时，发生这种情况的机会将非常渺茫，但目前对于开发来说，每个人都是赢家。

非常感谢任何建议。

Answer 1

您添加了一个名为playAgain 的按钮，但回调方法也称为playAgain，它们具有相同的名称，这就是导致错误的原因。

当第一次调用MyGame.Won.create() 并添加MyGame.Won.playAgain 按钮时，该按钮将保留对原始回调函数MyGame.Won.playAgain() 的引用。但是第二次启动 Won-state MyGame.Won.create() 也会被调用，然后对原始回调函数的引用丢失了，因为它被按钮有效地覆盖了。