无法读取未定义 Phaser.js 的属性 add()

Question

game.state.add() 函数有问题。由于某种原因 game 未定义：

Uncaught TypeError: Cannot read property 'add' of undefined at Object.init (main.js:51) at main.js:58

这是我的代码：

var socket; // global bir socket değişkeni.
    socket = io.connect(); // server a bağlantı isteği gönderir.
                           //Server bağlantı isteğini dinler ve clientlara başarılı olursa geri "connect" mesajını emitler.

    //Oyunun ekrana oturması için boyutları ayarlıyoruz.Browserla ilgili.
    var canvas_width = window.innerWidth * window.devicePixelRatio;
    var canvas_height = window.innerHeight * window.devicePixelRatio;   
    //Oyunumuzu belirlediğimiz divin içinde yaratıyoruz.
    var game = new Phaser.Game(canvas_width,canvas_height,Phaser.CANVAS,'gameDiv');

    var gameProperties = {
      //oyunun gerçek boyutları.oyun dünyasının genişliği ve uzunluğu.
      gameWidth:4000,
      gameHeight:4000,
    }

    //Oyunun ana state i.
    var main = function(game){

    };
    main.prototype ={
    preload:function(){

    },
    create:function(){ // oyun yaratıldığında çağrılır.
    console.log("Client yaratıldı.")
    //serverdan connect mesajı gelince onSocketConnected fonksiyonunu çalıştır.
    socket.on("connect",onSocketConnected); //serverdan gelecek connect mesajı için dinler.Socket.io bir client
                                            // servera bağlandığında otomatik olarak connect mesajını client a gönderir.
                                            //serverın clientlara mesaj göndermesine "emit"  denir.

    },    
    }
    function onSocketConnected(){
      console.log("Sunucuya bağlanıldı.")    
    };

    var gameBootStrapper = {
         init:function(gameContainerId){
             game.state.add('main',main);   //error here
             game.state.start('main');
         }
    };    
    gameBootStrapper.init('gameDiv');

我的index.html:

<body>
    <div id="gameDiv">
    </div>    
</body>
<script src="client/lib/phaser.js"></script>
<script src="/socket.io/socket.io.js"></script>
<script src ="client/main.js"></script>

这里有一张index.html的图片： ..................................................... ......

Answer 1

我认为这与范围和上下文有关。

您正在从 gameBootStrapper 的上下文中调用 init，并且变量 game 在该上下文中不存在。换句话说，我认为您还需要将 game 变量传递给 init 函数，以便 gameBootStrapper 对象能够访问该变量。所以像这样：

var gameBootStrapper = {
     init:function(gameContainerId, game){
         game.state.add('main', main);
         game.state.start('main');
     }
};    
gameBootStrapper.init('gameDiv', game);

您也可以通过某种方式将 init 绑定到不同的上下文，但我忘记了如何操作。我必须说，我发现 JavaScript 中的范围和上下文是棘手且不直观的恕我直言。

Answer 2

我遇到了同样的问题，我就是这样解决的。碰巧我使用的是 'phaser 3'，现在使用 game.scene 而不是 game.start。所以我只是将开始更改为场景并且它起作用了。

无法读取未定义 Phaser.js 的属性 add()

Cannot read property add() of undefined Phaser.js

javascript

phaser-framework

无法读取未定义 Phaser.js 的 属性 add()

Cannot read property add() of undefined Phaser.js

javascript

phaser-framework

无法读取未定义 Phaser.js 的属性 add()