NarraLeaf

useLiveGame

useLiveGame 钩子，返回 LiveGame 以读取故事服务、当前场景与玩家偏好

通过这个钩子可以访问实时游戏对象

注意： 此钩子只能在 GameProvider 的后代组件中使用

function useLiveGame(): LiveGame;

LiveGame 身上只有三个属性 —— game、events、story，其余一律是方法。故事当前所在的场景用 getLastScene() 取，玩家偏好则属于它正在跑的 Game（liveGame.game.preference）。

用法

import {useLiveGame} from "narraleaf-react";
function myComponent() {
    const liveGame = useLiveGame();

    useEffect(() => {
        // 故事服务
        const gallery = liveGame.story?.getService<Gallery>("gallery");

        // 故事当前所在的场景
        const currentScene = liveGame.getLastScene();

        // 玩家偏好属于 Game，不在 LiveGame 上
        const cps = liveGame.game.preference.getPreference("cps");
    }, [liveGame]);
}

常见用例

访问服务

function GalleryComponent() {
    const liveGame = useLiveGame();
    
    const gallery = liveGame.story?.getService<Gallery<{timestamp: number}>>("gallery");
    
    if (gallery) {
        const allItems = gallery.$getAll();
        return (
            <div>
                {Object.keys(allItems).map(name => (
                    <div key={name}>{name}</div>
                ))}
            </div>
        );
    }
    
    return null;
}

访问游戏状态

function GameStatusComponent() {
    const liveGame = useLiveGame();
    
    return (
        <div>
            <p>当前场景: {liveGame.getLastScene()?.config.name}</p>
            <p>是否在播放: {String(liveGame.isPlaying())}</p>
        </div>
    );
}

本页目录

用法常见用例访问服务访问游戏状态