Main.js定义与模块不一致

时间:2018-05-03 20:59:34

标签: javascript webpack phaser-framework

我正在使用Phaser框架来创建游戏。我有两个文件,main.jsPlayer.js,用于保存Player类。

main.js:

import 'pixi'
import Phaser from 'phaser'

import Player from './controllers/Player.js'

var game = new Phaser.Game(1280, 703, Phaser.AUTO, '', {
    preload: preload, 
    create: create, 
    update: update
});

var player;

function preload() {
    this.stage.backgroundColor = '#eee',
    this.scale.pageAlignHorizontally = true,
    this.scale.pageAlignVertically = true,
    this.scale.scaleMode = Phaser.ScaleManager.SHOW_ALL,

    game.load.spritesheet( 'idle', '../../assets/sheet_hero_idle.png', 64, 64 ),
    game.load.spritesheet( 'wall', '../../assets/roguelike-cave-pack/Spritesheet/roguelikeDungeon_transparent.png', 16, 16 )
}

function create() {
    //Player Controller
    //===========================
    //Enable Physics on the world
    game.physics.startSystem( Phaser.Physics.ARCADE );
    game.physics.arcade.setBoundsToWorld();

    //Enable input
    game.inputEnabled = true;

    //create player
    player = new Player( game, game.world.centerX, game.world.centerY, 'idle' );
    game.add.existing( player ); //Create on screen
    game.physics.arcade.enable( player ); //Create physics body on this object

    console.log("player is\t", player); //TEST
    console.log("player body is\t", player.body); //TEST
    console.log("player body is enabled\t", player.body.enable); //TEST

    player.playAnim( 'idle', 10, true );

    game.input.onDown.add( player.thisIsMyBody, this ); //When a click input occurs, call player.thisIsMyBody()

Player.js:

export default function Player( game, x, y, animKey ) {
    Phaser.Sprite.call( this, game, x, y, animKey),
    this.anchor.setTo( 0.5 ),
    this.inputEnabled = true,
    this.assets = {
        animations: {}
    },
    this.animations.add( 'idle' ),
    this.animations.play( 'idle', 10, true ), 
    this.alive = true
};

Player.prototype = Object.create( Phaser.Sprite.prototype );

Player.prototype.constructor = Player;

Player.prototype.thisIsMyBody = function(){ //TEST
    console.log( "I am ", this );
    console.log( "My body is ", this.body);
},

Player.prototype.playAnim = function( key, speed, isLoop ) {
    this.animations.play( key, speed, isLoop );
},

Player.prototype.move = function() {
    this.body.velocity.x = 30;
}

console.log("player is\t", player);返回播放器对象

console.log("player body is\t", player.body);返回玩家身体

console.log("player body is enabled\t", player.body.enable);返回true

但是,player.thisIsMyBody会返回game对象和undefined

我有什么遗漏或误用了this吗?

2 个答案:

答案 0 :(得分:0)

您是正确的,在绑定到this时,您会误导input.onDown

Haven未经过测试,但尝试更改

game.input.onDown.add(player.thisIsMyBody, this);

game.input.onDown.add(this.thisIsMyBody, player);

或可能只是

game.input.onDown.add(thisIsMyBody, player);

添加Phaser.Signal侦听器时,第二个参数基本上回答了问题"调用回调时this应该是什么意思?"。

答案 1 :(得分:0)

经过一些修补,我发现以下工作:

this.player = new Player( game, game.world.centerX, game.world.centerY, 'idle' );
game.add.existing( this.player ); //<--WILL NOT WORK WITHOUT
game.physics.arcade.enable( this.player );

game.camera.follow( this.player );
game.input.onDown.add( this.player.thisIsMyBody, this.player );