本页面由 PageTurner AI 翻译(测试版)。未经项目官方认可。 发现错误? 报告问题 →
什么是 Redux Toolkit?
Redux Toolkit 是我们官方推出的、开箱即用的高效 Redux 开发工具集。它旨在成为编写 Redux 逻辑的标准方式,我们强烈推荐您使用它。
它包含多个实用函数,可简化最常见的 Redux 使用场景,包括 store 配置、定义 reducers、不可变更新逻辑,甚至能一次性创建完整的 state "切片"而无需手动编写任何 action creators 或 action types。它还内置了最常用的 Redux 插件,如处理异步逻辑的 Redux Thunk 和编写 selector 函数的 Reselect,让您能立即使用这些功能。
安装
可通过 NPM 安装 Redux Toolkit 包,适用于模块打包工具或 Node 应用:
# NPM
npm install @reduxjs/toolkit
# Yarn
yarn add @reduxjs/toolkit
设计目的
Redux 核心库刻意保持中立性,让您自主决定如何处理所有事项,例如 store 配置、state 内容构成以及 reducer 的构建方式。
这在某些情况下是优势,因为它提供了灵活性,但这种灵活性并非总是必需。有时我们只希望以最简单的方式开始,获得开箱即用的良好默认行为。或者,当您开发大型应用时,可能会发现自己重复编写相似代码,并希望减少手动编写的代码量。
Redux Toolkit 的诞生正是为了解决关于 Redux 的三个常见痛点:
-
"配置 Redux store 过于复杂"
-
"必须添加大量依赖包才能使 Redux 发挥作用"
-
"Redux 需要太多样板代码"
虽然无法解决所有用例,但秉承 create-react-app 和 apollo-boost 的理念,我们可以提供官方推荐的工具集,处理最常见用例并减少额外决策成本。
为什么应该使用 Redux Toolkit
Redux Toolkit 通过内置推荐的最佳实践、提供良好默认行为、捕获错误并允许编写更简洁的代码,使开发高质量 Redux 应用更简单且更高效。无论用户技能水平或经验如何,Redux Toolkit 对所有 Redux 用户都大有裨益。它既可用于新项目初始搭建,也可在现有项目中逐步迁移采用。
请注意:使用 Redux 并不强制要求使用 Redux Toolkit。许多现有应用使用其他 Redux 封装库或完全手动编写 Redux 逻辑,如果您仍倾向其他方案,请继续使用!
但我们强烈建议所有 Redux 应用都使用 Redux Toolkit。
总之,无论您是刚接触 Redux 的新手在搭建首个项目,还是希望简化现有应用的经验丰富的开发者,使用 Redux Toolkit 都将使您的代码更优质且更易维护。
包含内容
Redux Toolkit 包含以下核心功能:
-
configureStore(): 封装createStore以提供简化配置选项和良好默认值。它能自动合并切片 reducers,添加您提供的任何 Redux 中间件,默认包含redux-thunk,并启用 Redux DevTools 扩展。 -
createReducer():允许提供操作类型与对应 reducer 函数的查找表,无需编写 switch 语句。此外,它自动使用immer库,支持通过常规可变代码(如state.todos[3].completed = true)编写更简洁的不可变更新逻辑。 -
createAction():为给定操作类型字符串生成操作创建函数。该函数本身定义了toString()方法,因此可直接替代类型常量使用。 -
createSlice():接收包含 reducer 函数的对象、切片名称和初始状态值,自动生成带有对应操作创建函数和操作类型的切片 reducer。 -
createAsyncThunk:接收操作类型字符串和返回 Promise 的函数,生成基于该 Promise 分发pending/fulfilled/rejected操作类型的 thunk。 -
createEntityAdapter:生成一组可复用的 reducer 和选择器,用于管理 store 中的规范化数据。 -
从 Reselect 库重新导出的
createSelector工具函数,方便直接使用。
Redux Toolkit 还包含 RTK Query 数据获取 API。RTK Query 是专为 Redux 构建的强大数据获取与缓存工具,旨在简化 Web 应用中的数据加载场景,无需手动编写数据获取和缓存逻辑。
文档
完整的 Redux Toolkit 文档请访问 https://redux-toolkit.js.org。