将Phaser与React结合使用

Question

我试图了解如何在React应用程序中使用React来渲染所有UI元素，并使用Phaser来渲染游戏（使用Canvas或WebGL）。

一种方法是使用React的componentDidMount，因此在准备好HTML之后，我可以使用div id渲染Phaser内容。在这种情况下，谁进行渲染？移相器的反应？

如果上述方法不正确，您可以建议另一种方法吗？

Answer 1

Github上有一个名为“react-phaser”的模块。这是一个不使用任何单独模块的 CodePen 。

var PhaserContainer = React.createClass({

    game: null,
    ...
    componentDidMount: function(){
        this.game = new Phaser.Game(800, 400, Phaser.AUTO, "phaser-container", 
        { 
            create: this.create,
            update: this.update
        });
    },
    ...
    render: function(){
        return (
            <div className="phaserContainer" id="phaser-container">
            </div>
        );
    }
    ...
}

这不是我的 CodePen。感谢Matthias.R