使用RTK Query时,何时使用useDispatch与useSelector Hooks?
Redux Toolkit + RTK Query 开发场景困惑解答
为什么你感觉没用到Slices/Redux状态?
RTK Query 已经帮你把API请求的所有状态(加载状态、返回数据、错误信息)自动存入Redux Store了,而且它内部封装了对应的action和reducer逻辑,不需要你手动写slice。你看不到slice代码,只是因为RTK Query替你完成了这部分工作,并非真的没用到Redux状态。
当前方案的合理性
文档建议的「容器组件用RTK Query Hooks获取数据,再传递给纯展示组件」是完全没问题的最佳实践:
- 容器组件专注处理数据获取、状态判断等逻辑
- 展示组件只负责接收props渲染UI,完全纯函数化,更容易测试和复用
什么时候需要手动用Slices、useSelector/useDispatch?
你需要手动介入Redux状态管理的场景主要是处理非API相关的本地状态,比如:
- 本地UI交互状态:表单输入值、侧边栏展开/收起状态、弹窗显示/隐藏、分页页码等临时状态
- 对API数据的本地派生状态:如果需要对RTK Query返回的数据做过滤、排序、聚合,且这个加工结果需要在多个组件共享,你可以把加工后的数据存到自定义slice,或者用
createSelector派生状态 - 全局共享的非API状态:比如用户的主题偏好、全局权限标识、多组件共享的筛选条件等
- 联动逻辑:比如API请求成功后,需要触发某个本地状态更新(比如显示成功提示、重置表单),这时候可以在RTK Query的
onSuccess回调里用useDispatch派发自定义action
最佳实践总结
- API相关的状态(加载、数据、错误)完全交给RTK Query管理,不用手动写slice
- 本地UI状态、非API的全局共享状态,用自定义slice配合
useSelector/useDispatch处理 - 坚持容器组件与展示组件分离的模式,让代码职责更清晰
内容的提问来源于stack exchange,提问作者SYKO
相关产品推荐
相关产品推荐

