phaser icon indicating copy to clipboard operation
phaser copied to clipboard

A project launched using the Vue3 template, I don't know why it keeps repeatedly rendering the DOM

Open q975702873 opened this issue 2 months ago • 1 comments

Version

  • Phaser Version: 3.80.1
  • Operating system: 3.80.1
  • Browser:3.80.1

Description

Example Test Code

Additional Information

A project launched using the Vue3 template, I don't know why it keeps repeatedly rendering the DOM App.vue

main.js const config = { type: Phaser.AUTO, width: window.innerWidth * 4, height: window.innerHeight * 4, parent: 'game-container', backgroundColor: '#fcc1db', scale: { mode: Phaser.Scale.FIT, }, scene: [ Game ] };

const StartGame = (parent) => { return new Phaser.Game({ ...config, parent }); }

PhaserGame.vue

Game.js

    this.load.on('progress', value => {
        EventBus.emit('current-scene-progress', value);
    });

    this.load.on('complete', () => {
        // progress.destroy();
    });



    this.load.image('people', 'images/people.png');

  
    BoardsArr.forEach((items) => {
        this.load.image(`lattice${items.id}`, `images/${items.id}.png`);
    })


    this.load.image(`bg`, 'images/bg.jpg');

    this.load.image(`logo`, 'images/logo.png');
  
    this.load.image(`title`, 'images/title.png');
   
    this.load.image(`bigshots`, 'images/bigshots.png');
    
    this.load.image(`myprize`, 'images/myprize.png');

    this.load.image(`gamerules`, 'images/gamerules.png');
 
    this.load.image(`excludingprops`, 'images/excludingprops.png');

    this.load.image(`opportunities`, 'images/opportunities.png');

    this.load.image(`luckydraws`, 'images/luckydraws.png');


    this.load.image(`bg-intestine`, 'images/intestine.png');
    EventBus.emit('current-scene-ready', this);
    
    
    Opening it on WeChat on your phone will keep loading repeatedly

q975702873 avatar Apr 24 '24 13:04 q975702873

It was ultimately discovered that the width: window. innerWidth * 4 was caused by an excessively large value thanks!

const config = { type: Phaser.AUTO, width: window.innerWidth * 4, height: window.innerHeight * 4, parent: 'game-container', backgroundColor: '#fcc1db', scale: { mode: Phaser.Scale.FIT, }, scene: [ Game ] };

q975702873 avatar Apr 25 '24 14:04 q975702873