useGameStore

在 React 组件中使用状态（假设已通过 createGameState 创建了 state）。

基本使用


import { useGameStore } from "@core/state";
 
const ScorePanel = () => {
  const { score, life } = useGameStore(state);
  return (
    <div>
      <p>分数: {score}</p>
      <p>生命: {life}</p>
    </div>
  );
};

选择器

只订阅部分状态，优化性能。


const score = useGameStore(state, (s) => s.score);

setReactState()

在 React 组件中修改状态。与 set() 不同，setReactState() 专门用于 React 组件内部，能捕获对应的状态修改并保存到存档中。


const Counter = () => {
  const store = useGameStore(state);
  return (
    <button onClick={() => state.setReactState({ count: store.count + 1 })}>
      计数: {store.count}
    </button>
  );
};

注意： 其他的场景语句不能在 React 中执行，但是状态更新可以通过 setReactState() 进行。