Phaser.js中keyup-LEFT键盘弹起事件绑定无效问题求助

问题分析 #

你遇到的问题核心出在事件绑定的位置、方式以及对象引用错误上：

• 把scene.input.keyboard.on这类事件绑定放在update()中，会导致每帧重复注册事件监听，短时间内累积大量监听引发内存溢出，最终游戏崩溃黑屏
• 直接使用'keyup-LEFT'这种字符串事件名，容易因为Phaser的事件命名规范匹配问题失效；用player.input.keyboard属于错误引用——精灵对象本身没有input.keyboard属性，直接调用会触发报错崩溃
• 用普通函数作为事件回调时，this的指向会发生偏移，可能导致无法正确访问player或场景属性

正确实现方案 #

推荐使用createCursorKeys()创建的光标键对象绑定弹起事件，这种方式更直观且不易出错，代码必须放在create()方法中执行：

create() {
    // 初始化你的player精灵
    this.player = this.physics.add.sprite(100, 100, 'player');
    
    // 创建光标键对象
    const cursors = this.input.keyboard.createCursorKeys();

    // 左键弹起事件
    cursors.left.on('up', () => {
        this.player.setVelocityX(0);
        this.player.anims.play('stopLeft');
    });

    // 右键弹起事件
    cursors.right.on('up', () => {
        this.player.setVelocityX(0);
        this.player.anims.play('stopRight');
    });
}

如果需要监听全局键盘弹起事件，也可以采用如下写法：

create() {
    // ... 其他初始化代码
    this.input.keyboard.on('keyup', (event) => {
        if (event.code === 'ArrowLeft') {
            this.player.setVelocityX(0);
            this.player.anims.play('stopLeft');
        } else if (event.code === 'ArrowRight') {
            this.player.setVelocityX(0);
            this.player.anims.play('stopRight');
        }
    });
}

关键注意事项 #

• 事件绑定仅在create()中执行一次：绝对不要把事件监听放在update()里，否则会重复注册大量事件导致性能问题甚至崩溃
• 使用箭头函数保证作用域：箭头函数会继承当前上下文的this，确保能正确访问场景中的player对象
• 避免错误引用对象：键盘事件属于场景的input管理器，不要尝试给精灵对象绑定键盘事件

内容的提问来源于stack exchange，提问作者chylinski