Utilizing the variables defined in the create function within the update function of Phaser 3

Question

Utilizing the variables defined in the create function within the update function of Phaser 3

I'm facing an issue in my game where I can't access a variable that I declared in the create function when trying to use it in the update function. Here is a snippet of what I'm trying to achieve:

create()
    {
       const map = this.make.tilemap({ key: 'mainmap' })
       const tileset = map.addTilesetImage('Serene_Village_16x16', 'tiles', 16, 16, 1, 2)

       const Next1 = map.createLayer('Next', tileset)

update(t: number, dt: number){       
        
    this.physics.world.collide(this.faune, Next1, ()=>{
        console.log("testing")
        this.scene.stop(),
        this.scene.start('secondmap');
        });

The problem here is that I'm unable to access 'Next1' in order to use it for collision detection with my player character "faune". The error message I get says "Cannot find name 'Next1'. If anyone has any suggestions on how to deal with this situation in Phaser, I would greatly appreciate it.

Thanks, arthur

javascript typescript phaser-framework

Answer 1

Answer №1

The issue arises from the fact that you are defining the function Next1 within the create function and then attempting to access it in the update function.
To resolve this, you could define a property within the create function, like so:

this.next1 = map.createLayer('Next', tileset)

In the update function, you can utilize it as follows:

this.physics.world.collide(this.faune, this.next1, () => { 
    // ...
});

To prevent any compiler errors, particularly when using TypeScript, you need to include the property in the class definition.

class myScene extends Phaser.Scene {
    // Use the appropriate data type if known
    public next1:any; 
    ...
}

Alternatively, you can relocate the this.physics ... code back into the create function.

Answer 2

The issue arises from the fact that you are defining the function Next1 within the create function and then attempting to access it in the update function.
To resolve this, you could define a property within the create function, like so:

this.next1 = map.createLayer('Next', tileset)

In the update function, you can utilize it as follows:

this.physics.world.collide(this.faune, this.next1, () => { 
    // ...
});

To prevent any compiler errors, particularly when using TypeScript, you need to include the property in the class definition.

class myScene extends Phaser.Scene {
    // Use the appropriate data type if known
    public next1:any; 
    ...
}

Alternatively, you can relocate the this.physics ... code back into the create function.

Utilizing the variables defined in the create function within the update function of Phaser 3

Answer №1

Similar questions

The Facebook JS SDK is causing an XSS error and returning a "user_denied" response, even though the Auth Popup for FB.Login is not being

Using React hooks to update the state of an array from one component to another

KeyBy lodash method stores values in an object using the specified property as keys

Exploring disparities between the Client SDK and Admin SDK in conducting firestore queries

Troubleshooting directive not functioning properly with AngularJS ng-click

Create an interactive mechanism where one scrollbar dynamically adjusts another scrollbar and vice versa

Display only the selected index and conceal the rest

Push the accordion tab upwards towards the top of the browser

Permanently removing artwork from the Canvas

Ensure that all asynchronous code within the class constructor finishes executing before any class methods are invoked

Preventing nested prototype methods from being transferred between objects in a WebWorker

Jasmine spies falsely report the calling of functions when they have not actually been called

Angular JS failing to display error messages

How can I call a method from a class using Typescript when getting an error saying that the property does not exist on the

Stop GIFs from playing automatically

Building an object in React using JavaScript: A step-by-step guide to including all necessary fields

The object does not contain a 'navigation' property within the 'Readonly<{}> & Readonly<{ children?: ReactNode; }>' type

What is the reason that setState functions properly when parsing each key separately, but fails when passed as an object?

Unlocking the Power of Large Numbers in Angular with Webpack

Instruct Smarty to display the block exactly as it is