TWLibsBridge

TWLibsBridge 是 CG.TwilightWarsLib 和 React function component 之間的橋接工具。

主要提供：

• 在 React component 中取得目前的 Game
• 取得目前的 controller
• 取得目前玩家的 actor
• 用 hooks 監聽 TwilightWarsLib 的 EventEmitter
• 在 component 卸載或遊戲切換時，自動清理事件 listener
• 使用 C.G 原本的 React 環境掛載 function component

TWLibsBridge 不會另外保存一份遊戲狀態，也不會取代 TwilightWarsLib 原本的 controller、socket、狀態機或 EventEmitter。

基本使用方式

先在遊戲 UI 最外層放入 TWLibsProvider：

function GameRoot(props: { game: CG.TwilightWarsLib.games.Game }) {
    return (
        <CG.TWLibsBridge.TWLibsProvider game={props.game}>
            <GameUI />
        </CG.TWLibsBridge.TWLibsProvider>
    );
}

接著 component 裡就可以使用 bridge 提供的 hooks。

function GameUI() {
    const game = CG.TWLibsBridge.useTWGame();
    const controller = CG.TWLibsBridge.useTWController();
    const me = CG.TWLibsBridge.useTWMyActor();

    return <div>{me ? me.code : "Waiting"}</div>;
}

文件入口

詳細使用說明已移到 website 文件站。

C.G 依賴

專案需要安裝：

• TwilightWarsLib
• React
• ReactMaterial

TWLibLib 會由 TwilightWarsLib 帶入，不需要在使用 bridge 的專案另外安裝。

作者

DeLove

本模組僅供嘎姆擂台內部專案開發使用，不保證其穩定性。