Phaser 3:create a sprite inside a function

Phaser 3
1

I created a tile function in create and in the tile function I created this.add.sprint but an error occurred. what’s wrong? can anyone help me?
function create(){
var Tile = function(column, row, group) {

this.states = {

    ZERO       : 0,

    ONE        : 1,

    TWO        : 2,

    THREE      : 3,

    FOUR       : 4,

    FIVE       : 5,

    SIX        : 6,

    SEVEN      : 7,

    EIGHT      : 8,

    DEFAULT    : 9,

    FLAG       : 10,

    WRONG_FLAG : 11,

    UNKNOWN    : 12,

    MINE       : 13

};

this.column      = column;

this.row         = row;

this.x           = column * gameProperties.tileWidth;

this.y           = row * gameProperties.tileHeight;

var tile         = this;

var currentState = this.states.DEFAULT;

var currentValue = this.states.ZERO;

var sprite = this.add.sprite

(

    this.x,

    this.y,

    graphicAssets.tiles.name,

    currentState,

    group

);

}
}

2

Hi,
Try to move your tile function from create, and call the function from create

3

Hi @Fedli_Kurniawan ,
You are using this.add inside a nesting function inside create(), so the Phaser scene is out of scope (this is not refering to the scene). One solution is convert Tile to an arrow function, that changes the scope:

var Tile = () => {
    // ...
    var sprite = this.add.sprite(...) // this only have 4 arguments
    // ...
}

Greetings.