问题标签 [redux-toolkit]

For questions regarding programming in ECMAScript (JavaScript/JS) and its various dialects/implementations (excluding ActionScript). Note JavaScript is NOT the same as Java! Please include all relevant tags on your question; e.g., [node.js], [jquery], [json], [reactjs], [angular], [ember.js], [vue.js], [typescript], [svelte], etc.

0 投票
1 回答
71 浏览

redux - 使用 redux-toolkit 切换步骤更新存储状态而不是视图

您好,我有一个StepWizard具有本地状态的组件。

我正在尝试将其更改为使用redux-toolkit

我坚持使用商店提供的状态切换步骤。我想要实现的是能够控制内部StepWizard和外部的步骤变化。有人可以给我一个提示我做错了什么吗?谢谢你。

0 投票
2 回答
805 浏览

reactjs - Reducer 状态没有被新对象更新 [redux, redux-toolkit, normalize]

有一个 DeliveryManifestView 组件。它运行一个分派 thunk 的效果。

useEffect - 获取数据

thunk 从 api 获取数据,然后用normalizr.

normalizedData传递给由 创建的动作redux-toolkit

获取数据,规范化,并传递给reducer

并且reducer返回实体的新对象。

返回实体

它在第一次运行时完美运行。但是,如果我去另一个视图然后回来

效果重新运行,thunk 被调度,

数据来自api,

数据再次传递给reducer,reducer返回新数据,

但状态没有变化,我仍然得到旧状态。

这是来自 redux devtools 的操作差异

这是第一次渲染 第一次运行

返回另一个视图并返回后

此处未更改数据

数据缩减器中没有差异,即使新数据来自 api。

0 投票
1 回答
43 浏览

javascript - React-Toolkit、类型和 Javascript 的问题

我按照本教程来了解如何在 React 项目中使用 redux-toolkit。 https://redux-flash-cards.netlify.com/ 我能够成功编译并执行该项目。

由于我当前项目的限制,我无法在这个 React 项目中使用 Typescript,所以我试图只使用 javascript 来使用同一个项目。于是,我开始用Javascript的方式重写一些代码。但是,有一些我不知道如何解决的不兼容问题。

我的问题是我收到错误

在 flash-cards/src/redux/store.ts 的第 (16) 行。

我认为这是因为 Javascript 不能使用类型。

上述问题导致 flash-cards/src/App.tsx 的第 25、30 和 31 行出现其他错误,因为该文件无法导入之前的文件(在 JS 版本中)。所以我不知道该怎么做(第25行)

有人建议我使用 flow 或 proptypes 来解决问题,但实际上我迷失了寻找正确的解决方案。

如果您能帮助解决这个问题,我将不胜感激。

谢谢

0 投票
0 回答
940 浏览

typescript - 如何在 redux-toolkit 上正确键入 NormalizedSchema 作为 PayloadAction?

我决定使用redux-toolkit减少 redux 样板。我的问题是,我似乎找不到输入规范化有效负载的示例或正确方法?

我在 React Native 项目中使用 TS 样板。

这是我的简化用例。

来自 types.d.ts

宠物状态切片

来自 schema.ts

调用fetchPetsSuccessreducer会抛出TS错误

0 投票
1 回答
5944 浏览

reactjs - 如何使用 createSlice 进行 API 调用

当使用 redux-tookkit 中的 createSlice 时,我很难理解我在哪里进行异步调用。我尝试按照文档进行操作,但迷失了所有 TypeScript 的内容。(我没有使用 TS)我有一个登录组件:

和一个登录片:

我想调用我的 API 来获取令牌:

我该去哪里打电话。提前感谢您提供的任何见解!

0 投票
3 回答
49105 浏览

javascript - 如何将 Redux-Thunk 与 Redux Toolkit 的 createSlice 一起使用?

我遇到了 Redux Toolkit (RTK),并希望实现它提供的更多功能。我的应用程序分派到通过createSlice({})(参见createSlice api docs)创建的 reducers 切片

到目前为止,这非常有效。我可以轻松地使用内置dispatch(action)useSelector(selector)调度操作,并在我的组件中很好地接收/响应状态变化。

我想使用来自 axios 的异步调用从 API 获取数据并更新存储,因为请求是 A) 开始 B) 完成。

我已经看到redux-thunk并且似乎它完全是为此目的而设计的,但是新的 RTK 在createSlice()接下来的一般谷歌搜索中似乎并不支持它。

以上是使用切片实现 thunk 的当前状态吗?

我在文档中看到您可以添加extraReducers到切片中,但不确定这是否意味着我可以创建更多使用 thunk 的传统减速器并让切片实现它们?

总的来说,这是一种误导,因为 RTK 文档显示您可以使用 thunk,但似乎没有提到它不能通过新的 slices api 访问。

Redux 工具包中间件示例

我的切片代码显示了异步调用将失败的位置以及其他一些可以工作的示例减速器。

我的商店设置(商店配置)。

0 投票
1 回答
5935 浏览

reactjs - 如何在 redux-toolkit 中正确使用带有元类型的 PayloadAction?

简化示例

我收到这些错误。

0 投票
2 回答
4959 浏览

reactjs - Redux Toolkit:如何将使用 createAction 创建的操作作为类型引用

Redux 工具包提供了createAction辅助方法。我无法将使用createActionas 类型创建的操作引用。

例如

我怎么知道exampleSagaaction是类型getData



要查看我是如何尝试这样做的,请参阅以下(示例)代码并查看我所面临问题的评论:

减速器.ts

sagas.ts

0 投票
1 回答
920 浏览

javascript - 类型“布尔”不可分配给类型“CaseReducer”'

我使用 redxjs/toolkit 创建了一个删除减速器:

我在打字稿中遇到了这个错误:

0 投票
1 回答
6104 浏览

reactjs - 有没有办法在 createSlice 中访问全局状态?

这是一个例子:

我可以访问计数器状态吗?假设我只想在计数器为 30 时增加年龄。否则,我需要在useEffect钩子中的计数发生变化时监听并调度一些处理年龄增加的操作(?)。

换句话说,根据当前全局状态计算状态切片的最佳方法是什么redux-toolkit