Question

我正在关注我学习Javascript时正在开发的游戏的太空射击教程。本教程将许多类放在一个文件中，一个个又一个地堆叠在一起，但是我读到这不是一个好习惯，所有类都应该有自己的单独文件。教程的链接在这里...

https://yorkcs.com/2019/02/08/build-a-space-shooter-with-phaser-3-4/

我确保所有内容都正确键入，但是每当我在Chrome中运行（并且我也清除了缓存）时，都会收到一条错误消息，提示...

未捕获的TypeError：无法读取null的属性“ getFirstTick”

在此代码行中，它会在errors.js的第21行引发错误……

this.play( 'basicenemy' );

我尝试了几件事，因为遇到了不同的错误。我认为我犯了以下单独的教程的错误。我尝试将图像添加到文件本身而不是第一级的sceneMain.js文件中，因为有一次它告诉我play（）未定义。

entities.js

class Entities extends Phaser.GameObjects.Sprite
{
  constructor(scene, x, y, key, type)
  {
    super(scene, x, y, key, type);
    this.scene = scene;
    this.scene.add.existing(this);
    this.scene.physics.world.enableBody(this, 0);
    this.setData("type", type);
    this.setData("isDead", false);
  }
}

enemies.js

class BasicEnemy extends Entities
{
  constructor(scene, x, y)
  {
    super(scene, x, y, 'basicenemy', 'BasicEnemy');
    this.body.velocity.y = Phaser.Math.Between(50, 100);
    this.shootTimer = this.scene.time.addEvent({
        delay: 1000,
        callback: function() {
          var laser = new EnemyLaser(
            this.scene,
            this.x,
            this.y
          );
          laser.setScale(this.scaleX);
          this.scene.enemyLasers.add(laser);
        },
        callbackScope: this,
        loop: true
      });
    this.play( 'basicenemy' );
  }
}

sceneMain.js

//The Bullet Group
    this.basicEnemy = this.add.group();
    this.enemyLasers = this.add.group();
    this.playerLasers = this.add.group();

    this.time.addEvent({
        delay: 100,
        callback: function() {
          var enemy = new BasicEnemy(
            this,
            Phaser.Math.Between(0, this.game.config.width),
            0
          );
          this.basicEnemy.add(enemy);
        },
        callbackScope: this,
        loop: true
      });

在 sceneMain.js 中，我试图用此行从屏幕顶部生成敌人...

this.basicEnemy.add(enemy);

任何帮助将不胜感激。

Answer 1

class SceneMain extends Phaser.Scene 
{
constructor() 
{
    super('SceneMain');

}
preload()
//loads our images and sounds
{
    //this.load.image( "playership","images/blueship.png" );
    this.load.image( 'spaceback4','images/spaceback4.png' );
    this.load.spritesheet( 'blueships', 'images/blueships.png', { frameWidth: 73, frameHeight: 80 });
    this.load.spritesheet( 'blueshot', 'images/blueshipshot.png', { frameWidth: 20, frameHeight: 55 });
    this.load.spritesheet( 'basicenemy', 'images/basicenemy.png', { frameWidth: 65, frameHeight: 80 });

    this.load.audio( 'explosion', 'audio/explosion.mp3' );
    this.load.audio( 'laser', 'audio/lasershot.mp3' );
    this.load.audio( 'enemylaser', 'audio/enemylaser.mp3' );

}
create()
//define our objects 
{
    //The Starfield Background
    this.starfield = this.add.tileSprite( 0, 0, 1080, 900, "spaceback4" );   

    //The Grid System
    var gridConfig={ row:5, cols:5, scene:this };
    var alignGrid = new AlignGrid( gridConfig );
    //alignGrid.showNumbers();

    //The Score
    this.sb = new ScoreBox( {scene:this} );
    alignGrid.placeAtIndex( 2, this.sb );
    model.score = 0; 


    //The Player Ship
    this.playerShip = this.physics.add.sprite( 0,0, 'blueships' );
    this.anims.create({
        key: 'fly',
        frames: this.anims.generateFrameNames( 'blueships', {start: 0, end: 9 }),
        frameRate: 16,
        repeat: -1
    });
    this.playerShip.play( 'fly', this );
    alignGrid.placeAtIndex( 22, this.playerShip );
    this.playerShip.setCollideWorldBounds( true );

    //The Enemy Ships
    this.basicEnemy = this.physics.add.sprite( 0,0, 'basicenemy' )
    this.basicEnemy2 = this.physics.add.sprite( 0,0, 'basicenemy' )
    this.basicEnemy3 = this.physics.add.sprite( 0,0, 'basicenemy' )

    this.anims.create({
        key: 'badfly',
        frames: this.anims.generateFrameNames( 'basicenemy', {start: 0, end: 9 }),
        frameRate: 16,
        repeat: -1
    });
    this.basicEnemy.play( 'badfly', this );
    this.basicEnemy2.play( 'badfly', this );
    this.basicEnemy3.play( 'badfly', this );
    alignGrid.placeAtIndex( 6, this.basicEnemy );
    alignGrid.placeAtIndex( 7, this.basicEnemy2 );
    alignGrid.placeAtIndex( 8, this.basicEnemy3 );

    //The Bullet Group
    this.basicEnemy = this.add.group();
    this.enemyLasers = this.add.group();
    this.playerLasers = this.add.group();

    this.time.addEvent({
        delay: 100,
        callback: function() {
          var enemy = new BasicEnemy(
            this,
            Phaser.Math.Between(0, this.game.config.width),
            0
          );
          this.basicEnemy.add(enemy);
        },
        callbackScope: this,
        loop: true
      });

    //The Audio
    this.sfx = {
        laser: [
          this.sound.add( 'laser' ),
          this.sound.add( 'enemylaser' )
        ],
        explosion: this.sound.add( 'explosion' )
      };

    //The Starfield
    alignGrid.placeAtIndex( 12, this.starfield );

    //Controls
    this.cursors = this.input.keyboard.createCursorKeys();
    this.fireButton = this.input.keyboard.addKey(Phaser.Input.Keyboard.SPACE);

}
update()
//constant running loops 
{
    //Scroll the starfield
    this.starfield.tilePositionY += -1.5;

    //Player Movement
    this.playerShip.setAccelerationX( 0 );
    this.playerShip.setDragX( 300 );


    if (this.cursors.left.isDown)
    {
        this.playerShip.setAccelerationX (-300 );
    }
    if (this.cursors.right.isDown)
    {
        this.playerShip.setAccelerationX ( 300 );
    }

    //  Fire bullet
    /*if (this.fireButton.isDown || this.input.activePointer.isDown) 
    {
        this.fireBullet();
    }*/

}

Answer 2

OMG，我可以使用它！！！我只是从敌人.js中删除了 this.play（）并将其添加到sceneMain.js中。这是有效的新代码！由于某些原因，它不想从“敌人”类中播放，但是它在sceneMain中播放。我认为我只会使用已经起作用的代码来产生三个静止不动的敌人，并使用它来产生从本教程显示的顶部掉落的敌人。现在，我有了静止的敌人和产生并发射子弹的敌人！

//The Enemies and Bullet Group That Spawns from the Top
    this.basicEnemy = this.add.group();
    this.enemyLasers = this.add.group();
    this.playerLasers = this.add.group();

    this.time.addEvent({
        delay: 100,
        callback: function() 
        {
          var enemy = new BasicEnemy( this, Phaser.Math.Between(0, this.game.config.width), 0 );
          this.basicEnemy = this.physics.add.sprite(enemy);
          this.basicEnemy.play( 'badfly', this);
        },
        callbackScope: this,
        loop: true
      });

如何在Phaser 3中修复Uncaught TypeError以进行游戏开发

2 个答案: