首次加载游戏未定义变量时出现 Phaser 错误

Phaser error on first load of game undefined variables

当我在 Google Chrome 和 Firefox 中 运行 我的游戏时,游戏屏幕是黑色的,一旦我刷新它,它就会 运行 正常。

黑屏时我在控制台看到的错误是:

TypeError: paddle is undefined (Firefox)

Uncaught TypeError: Cannot read property 'x' of undefined (Chrome)

我也有警告:

Phaser.Loader - active loading canceled / reset (Firefox & Chrome)

我的代码的相关部分是:

var game = new Phaser.Game(800, 560, Phaser.AUTO, 'phaser-canvas', { preload: preload, create: create, update: update });

function setUpLevel(i) {
    $.getJSON("levels.json", function(json) {
            paddle.x = json.levels[i].paddle_startX;
    });
}

function processPaddle() {
    var paddle_loc = paddle.x + 80
}

function preload() {    
    //>Game assets
    game.load.image('paddle', 'assets/img/Paddle.png');

    // Load JSON file describing the level
    game.load.json('levels', 'levels.json');
}

//Paddle
var paddle;
var paddle_vel;

var json;

// The function below will be automatically invoked by Phaser when
// the assets in the preload() function finished loading

function create() {
    game.load.reset(true);

    var json = game.cache.getJSON('levels');

    // Enque the load of the background images found inside the level file

    for (var i = 0; i < json.levels.length; i++) {
        game.load.image('background' + i.toString(), json.levels[i].background);
    }

    // Specify loadComplete() as a callback to be called when all assets finished loading

    game.load.onLoadComplete.add(loadComplete, this);

    // Load the newly enqued assets

    game.load.start();
}

// The function below will be automatically invoked by Phaser when
// the assets in the create() function finished loading

function loadComplete() {
    json = game.cache.getJSON('levels');

    game.physics.startSystem(Phaser.Physics.ARCADE);

    paddle = mid_layer.create(100, 400, 'paddle');
    game.physics.enable(paddle, Phaser.Physics.ARCADE);

    paddle.scale.setTo(0.7, 0.7);
    paddle.body.immovable = true;
    paddle.body.collideWorldBounds = true;

    setUpLevel(current_level);    
}

 function update() {
        processPaddle();
 }

我猜这个错误是因为loadComplete()函数还没有完成,update()函数已经启动,它使用了paddle变量,它还没有被赋值——但是我'我不确定。

update 函数将在 create 完成后立即开始触发,但在您的情况下,此时桨不存在,因此将开始抛出错误。我建议您将游戏分解为多个状态,一个 'Boot' 状态可以加载您的 json + 预加载器资产,然后您可以切换到 'Preloader' 状态,它会拉入您的所有资产需要(从 json 中读取)。完成后,您可以进入游戏状态或类似状态。这也有助于让您(从逻辑上)保持清洁。

同意之前的回答 - 您应该考虑将游戏分解为多个状态。当你创建游戏时会发生什么 var game = new Phaser.Game(800, 560, Phaser.AUTO, 'phaser-canvas', { preload: preload, create: create, update: update });

您正在插入运行 'preload'、'create' 和 'update' 函数的对象。您的函数 processPaddle() 位于该对象之外,因为您将该对象中的函数设置为等于下面代码中同名的函数。

如果您在 State 对象中设置了代码,则可以包含 processPaddle() 并使用 this.processPaddle() 进行引用。

您可以通过将第一行中的 { preload: preload, create: create, update: update } 更改为 { preload: preload, create: create, update: update, processPaddle: processPaddle } 来更正它。