未捕获的引用错误.Phaser.io

Uncaught ReferenceError. Phaser.io

本文关键字:错误 Phaser io 引用      更新时间:2023-09-26

好吧,我正在构建一个游戏,在实现关卡选择后,我几乎让我的项目开始工作。但是,有一个错误(可能很容易修复)引起了我的注意。

在我的创建函数中,我

创建了变量"pages",但是当我想在其他函数中使用它时,我得到了引用错误:未捕获的引用错误:未定义页面。我对javascript相当陌生,我也尝试在参数中传递变量,错误会消失,但代码不会像我想要的那样工作。

我在创建函数中定义了页面,我想在箭头单击函数中使用它

UshanGame.Selection = function(game){};
var thumbRows = 2;
var thumbCols = 3;
var thumbWidth = 128;
var thumbHeight = 128;
var thumbSpacing = 3;
var levelThumbsGroup;
var currentPage = 0;
var leftArrow;
var rightArrow;
UshanGame.Selection.prototype = {
create: function(){
    console.log("%c ✔✔ Level Selection Ready! ✔✔", "color:red;");
    // array with finished levels and stars collected.
    var starsArray = [1,2,2,2,2,2,2,2,2,2,2,2,2,2,2,2,2,2];
    // how many pages are needed to show all levels?
    var pages = starsArray.length /(thumbRows * thumbCols);
    leftArrow = this.add.button(50, 420, "level_arrows", this.arrowClicked);
    leftArrow.anchor.setTo(0.5);
    leftArrow.frame = 0;
    leftArrow.alpha = 0.3;
    rightArrow = this.add.button(270, 420, "level_arrows", this.arrowClicked);
    rightArrow.anchor.setTo(0.5);
    rightArrow.frame = 1;
    // creation of the thumbails group
    levelThumbsGroup = this.add.group();
    // determining level thumbnails width and height for each page
    var levelLength = thumbWidth * thumbCols + thumbSpacing * (thumbCols - 1);
    var levelHeight = thumbWidth * thumbRows + thumbSpacing * (thumbRows - 1);
    // looping through each page
    for(var l = 0; l < pages; l++){
        // horizontal offset to have level thumbnails horizontally centered in the page
        var offsetX = (this.width-levelLength)/ 2 + game.width * l;
        // I am not interested in having level thumbnails vertically centered in the page, but
        // if you are, simple replace my "20" with
        // (game.height-levelHeight)/2
        var offsetY = 20;
        // looping through each level thumbnails
         for(var i = 0; i < thumbRows; i ++){
            for(var j = 0; j < thumbCols; j ++){  
                var levelNumber = i * thumbCols + j + l *(thumbRows * thumbCols);       
                var levelThumb = this.add.button(offsetX + j * (thumbWidth + thumbSpacing), offsetY + i * (thumbHeight + thumbSpacing), "levels", this.thumbClicked, this); 
                levelThumb.frame=starsArray[levelNumber];
                levelThumb.levelNumber = levelNumber + 1;
                levelThumbsGroup.add(levelThumb);
                // if the level is playable, also write level number
                if(starsArray[levelNumber] < 4){
                    var style = {
                        font: "18px Arial",
                        fill: "#ffffff"
                    };
                    var levelText = this.add.text(levelThumb.x + 5, levelThumb.y + 5, levelNumber + 1,style);
                    levelText.setShadow(2, 2, 'rgba(0,0,0,0.5)', 1);
                    levelThumbsGroup.add(levelText);
                }
            }
        }
    }
},
thumbClicked: function(button){
    // the level is playable, then play the level!!
    if(button.frame < 4){
        alert("playing level " + button.levelNumber);
    } else {
        var buttonTween = this.add.tween(button)
        buttonTween.to({
            x: button.x + thumbWidth / 15
        }, 20, Phaser.Easing.Cubic.None);
        buttonTween.to({
            x: button.x - thumbWidth / 15
        }, 20, Phaser.Easing.Cubic.None);
        buttonTween.to({
            x: button.x + thumbWidth / 15
        }, 20, Phaser.Easing.Cubic.None);
        buttonTween.to({
            x: button.x - thumbWidth / 15
        }, 20, Phaser.Easing.Cubic.None);
        buttonTween.to({
            x: button.x
        }, 20, Phaser.Easing.Cubic.None);
        buttonTween.start();
    }
},
arrowClicked: function(button){
    if(button.frame == 1 && currentPage < pages - 1){
        leftArrow.alpha = 1;
        currentPage++;
        if(currentPage == pages - 1){
            button.alpha = 0.3;
        }
        var buttonsTween = this.add.tween(levelThumbsGroup);
        buttonsTween.to({
            x: currentPage * game.width * -1
        }, 500, Phaser.Easing.Cubic.None);
        buttonsTween.start();
    }
    if(button.frame==0 && currentPage>0){
        rightArrow.alpha = 1;
        currentPage--;
        if(currentPage == 0){
            button.alpha = 0.3;
        }
        var buttonsTween = game.add.tween(levelThumbsGroup);
        buttonsTween.to({
            x: currentPage * game.width * -1
        }, 400, Phaser.Easing.Cubic.None);
        buttonsTween.start();
    }       
}
};

您收到错误是因为pagescreate函数中定义,但未在其他任何地方定义。 pages arrowClicked函数中不存在。

要解决此问题,请将pages与顶部的var声明一起添加,使其成为全局变量:

...
var leftArrow;
var rightArrow;
var pages;

然后修改create函数以引用此变量(通过删除 var 关键字):

// array with finished levels and stars collected.
var starsArray = [1,2,2,2,2,2,2,2,2,2,2,2,2,2,2,2,2,2];
// how many pages are needed to show all levels?
pages = starsArray.length /(thumbRows * thumbCols);