react如何管理状态
React 状态管理方法
React 内置状态管理
使用 useState 钩子管理局部状态，适用于组件内部简单的状态需求。例如：
const [count, setCount] = useState(0);useReducer 适用于复杂状态逻辑，通过 reducer 函数管理状态变更：
const [state, dispatch] = useReducer(reducer, initialState);Context API
通过 createContext 和 useContext 实现跨组件状态共享，避免多层 props 传递：
const MyContext = createContext();
<MyContext.Provider value={value}>
<ChildComponent />
</MyContext.Provider>第三方状态库
Redux 提供集中式状态管理，适合大型应用：
const store = createStore(reducer);
<Provider store={store}>
<App />
</Provider>MobX 采用响应式编程模型，通过装饰器或函数管理状态：
class Store {
@observable count = 0;
@action increment() { this.count++; }
}轻量级替代方案
Zustand 提供简单 API 管理状态，无需繁琐的样板代码：
const useStore = create(set => ({
count: 0,
increment: () => set(state => ({ count: state.count + 1 })),
}));Jotai 和 Recoil 专注于原子化状态管理，适合细粒度状态共享：
const countAtom = atom(0);
const [count, setCount] = useAtom(countAtom);服务器状态管理
React Query 或 SWR 专门处理异步数据状态，提供缓存、自动更新等功能：
const { data, isLoading } = useQuery('todos', fetchTodos);选择建议
小型应用优先考虑 Context API 或 Zustand。中型应用可选择 Redux Toolkit 或 MobX。大型复杂应用适合 Redux 配合中间件。需要频繁异步数据交互时推荐 React Query。
