有没有办法把phaser游戏对象变成react控制的组件？

npm install phaser react-phaser

import React, { useEffect, useRef } from 'react';
import { Game, GameObjects } from 'phaser';
import { GameInstance, PhaserComponent } from 'react-phaser';

const MyGame = () => {
  const gameRef = useRef(null);

  useEffect(() => {
    const config = {
      type: Phaser.AUTO,
      width: 800,
      height: 600,
      scene: {
        create: create,
        update: update
      }
    };

    const game = new Game(config);

    function create() {
      const text = new GameObjects.Text(game, 400, 300, 'Hello, Phaser!', { color: '#0f0' });
      this.add.existing(text);
    }

    function update() {
      // 游戏逻辑更新
    }

    gameRef.current = game;

    return () => {
      game.destroy(true);
    };
  }, []);

  return (
    <PhaserComponent game={gameRef.current} width={800} height={600} />
  );
};

export default MyGame;

import React from 'react';
import MyGame from './MyGame';

const App = () => {
  return (
    <div>
      <h1>Welcome to My Game</h1>
      <MyGame />
    </div>
  );
};

export default App;