Question

我在phaserjs中创建了一个组

this.fruitsOutline = this.game.add.group();

之后我添加了几个精灵。一切都正常。现在，如果想要从 onDragStart 事件处理程序中访问 this.fruitsOutline ，则会提供 undefined

var GameState = {

init:function(){
    this.physics.startSystem(Phaser.Physics.ARCADE);
},
create: function () {

    var innerImgPos = {x:150,y:200};
    var outlineImgPos = {x:460,y:200};
    var FIXED_DISTANCE_Y = 150;

    var gameData = [
        //...some data
    ];


    this.background = this.game.add.sprite(0, 0, 'background');

    this.overlapHappen = false;

    this.startPos = {x:150,y:197};


    this.fruitsOutline = this.game.add.group();
    this.fruitsInner = this.game.add.group();

    for(var i=0; i<gameData.length; i++){

        fruitOuter = this.fruitsOutline.create(outlineImgPos.x,((outlineImgPos.y+25)*i)+FIXED_DISTANCE_Y,gameData[i].fruit_outline.img);
        fruitOuter.name = gameData[i].fruitName;
        fruitOuter.anchor.setTo(.5);
        fruitOuter.customParams = {myName:gameData[i].fruit_outline.name};
        this.game.physics.arcade.enable(fruitOuter);
        fruitOuter.body.setSize(100,100,50,50);

        fruitInner = this.fruitsInner.create(innerImgPos.x,((innerImgPos.y+25)*i)+FIXED_DISTANCE_Y,gameData[i].fruit_inner.img);
        fruitInner.name = gameData[i].fruitName;
        fruitInner.anchor.setTo(0.5);
        fruitInner.inputEnabled = true;
        fruitInner.input.enableDrag();
        fruitInner.input.pixelPerfectOver = true;
        fruitInner.originalPos = {x:fruitInner.position.x,y:fruitInner.position.y};
        this.game.physics.arcade.enable(fruitInner);
        fruitInner.body.setSize(100,100,50,50);            



        fruitInner.customParams = {myName:gameData[i].fruit_inner.name,targetKey:fruitOuter,targetImg:gameData[i].fruit_outline.name};
        fruitInner.events.onDragStart.add(this.onDragStart);
        fruitInner.events.onDragStop.add(this.onDragStop,this);
    }        

},
update: function () {

},
onDragStart:function(sprite,pointer){
    console.log(this.fruitsInner) //this gives undefined I expect an array
},
onDragStop:function(sprite,pointer){
    var endSprite = sprite.customParams.targetKey;
    console.log(endSprite);
    this.stopDrag(sprite,endSprite)
},
stopDrag:function(currentSprite,endSprite){
    var currentSpriteRight = currentSprite.position.x + (currentSprite.width / 2);
    if (!this.game.physics.arcade.overlap(currentSprite, endSprite, function() {
        var currentSpriteTarget = currentSprite.customParams.targetImg;
        var endSpriteName = endSprite.customParams.myName;
        console.log(currentSpriteTarget,endSpriteName);
        if(currentSpriteTarget === endSpriteName){
            currentSprite.input.draggable = false;
            currentSprite.position.copyFrom(endSprite.position); 
            currentSprite.anchor.setTo(endSprite.anchor.x, endSprite.anchor.y); 
        }
        console.log(currentSprite.width);

      })) { 
        //currentSprite.position.copyFrom(currentSprite.originalPosition);
        currentSprite.position.x = currentSprite.originalPos.x;
        currentSprite.position.y = currentSprite.originalPos.y;
      }
},
render:function(){
    game.debug.body(this.fruitsInner);
    //game.debug.body(this.orange_outline);
}
}

Answer 1

添加拖动回调时，您错过了上下文。

尝试（添加this作为第二个参数）：

fruitInner.events.onDragStart.add(this.onDragStart, this);

哦，在回调内（或状态中的任何地方）this.fruitsInner将是Phaser.Group的实例，而不是像评论所说的数组。您正在寻找的数组可能是this.fruitsInner.children。

如何在Phaser.js中进行迭代

1 个答案: