问题标签 [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 回答
1834 浏览

javascript - 状态更改为未定义的值。我正在使用带有 redux-persist 的 redux-toolkit

我正在尝试在登录减速器中更改我的状态,但在state.user = data.user操作之后,console.log打印undefined

我的授权切片:

我的店铺:

另外,当我将我的中间件属性从 configureStore 配置为

这会在我的控制台中打印以下错误:

图片

0 投票
1 回答
145 浏览

react-redux - Redux Toolkit - 如何在切片之间共享操作

我正在使用 Redux Toolkit,并且有三个组件,每个组件都有一个切片:A、B、C。

我需要组件 A 来调度一个动作,组件 B 和 C 来对它做出反应。如何实现所有组件不相互依赖,类似于发布/订阅模式?

0 投票
1 回答
1045 浏览

reactjs - 使用 createReducer 时在 slice reducer 之间共享数据

我有一个 ReactJS 应用程序,TypeScriptredux正在使用redux-toolkit它来构建我的减速器。随着应用程序变得越来越大,我想开始重构我的减速器。

我的 redux 状态如下所示:

customers和切片是独立的orders,我可以轻松地为它们编写两个单独的减速器,然后将它们组合起来combineReducers

现在,我想进一步分解我的orders减速器。

  • state1并且state2是完全独立的。
  • state3取决于来自 的数据state1
  • state4取决于来自state1和的数据state2

有没有办法继续使用createReducerfrom (或工具包中的一些其他功能)为切片中的redux-toolkit每个嵌套切片orders创建减速器?

当我开始重写我的 reducer 时orders,这就是我目前所拥有的:

注意:我无法控制我的 redux 状态的结构。我并不完全依赖于使用redux-toolkit,但需要一个很好的理由让我的团队远离它。

0 投票
1 回答
582 浏览

redux - 如何在 Redux Toolkit 中使用带有切片的 Redux Promise Middleware?

我正在使用slicesRedux Toolkit 的功能。您可能知道,一个切片action为每个 created返回一个reducer

我想使用该redux-promise-middleware库,对于给定的ACTION_TYPE,它会创建三个可能的新操作:ACTION_TYPE_FETCHINGACTION_TYPE_FULFILLEDACTION_TYPE_REJECTED。从 的角度来看,我该如何处理slices

0 投票
1 回答
479 浏览

react-native - 没有为 key reducer 提供减速器(reducer underfine)

用户 authReduce 时出现错误。当记录这个减速器并显示“underfine”时,我正在使用:

  • Redux 持久存储身份验证状态
  • Redux 工具包

有时我尝试热重载它工作。所以我不明白为什么? 在此处输入图像描述 在此处输入图像描述 在此处输入图像描述

0 投票
4 回答
69759 浏览

javascript - 使用 redux 工具包时出现错误“在状态中检测到不可序列化的值” - 但不是正常的 redux

我正在尝试切换我正在构建的应用程序以使用 Redux Toolkit,并注意到当我从 createStore 切换到 configureStore 时出现此错误:

在四处寻找之后,我发现问题似乎出在我的自定义模型上。例如,品种数组是从品种模型创建的:

并使用它映射到一个字符串数组来创建我的 Varietal 数组,该数组进入我的状态:

当我切换出模型并将数组创建实用程序替换为返回对象的普通数组时,如下所示:

然后那个特殊的减速器的错误消失了,但是我在我的应用程序中都有这些自定义模型,在我开始将它们全部撕掉并重新编码它们只是为了能够使用我想在这里问的 Redux 工具包之前在我这样做之前真的是问题所在......

0 投票
2 回答
3858 浏览

redux - 从 createAsyncThunk 调用其他操作

通常在一个 thunk 中,您最终会调用其他操作:

createAsyncThunkredux 工具包中,这并不是那么简单。实际上,您可以从结果中的操作中改变状态extraReducers

但我也希望有非异步方式来启动配方,这将需要在切片中使用减速器:

为了避免在两个地方编写相同的代码,我希望能够从 thunk 处理程序中调用简单的 reducer 函数。我从案例中简单地尝试了startRecipe(state)startRecipe(它已经为鸭子导出而解构,所以我相当确定我指的是正确的函数),extraReducers但它不起作用。

我目前的解决方案是_startRecipe在切片之外定义,并在两种情况下都引用该函数

是否有一种“更好”的方式可以在您的中定义简单操作slice.reducers并从 thunk 处理程序中引用它extraReducers

0 投票
1 回答
119 浏览

reactjs - 如何使用 redux 操作更新 d3 图?

我正在尝试使用在鼠标事件(mouseenter、mouseleave)中调用的 redux 操作来存储来自工具提示的数据。

问题:当鼠标光标位于元素(g 元素)上时,我只期望mouseenter事件但mouseleave也被触发。这会导致更新 redux 存储并在循环中重新渲染 react 组件。

我有一个 svg 元素,然后我附加 g 元素,它是圆形和文本的包装器。我在 g 元素上添加了事件监听器。

这是我的代码:

如何使用 redux 操作正确更新 d3 图?

感谢您的回答

0 投票
1 回答
280 浏览

reactjs - 无法访问使用 Redux Toolkit 创建的 ActionCreator 的 action.payload

我似乎无法访问在 redux-observable 管道中使用 RTK 切片创建的操作的有效负载。我想知道 redux-observable 是否设计为与 RTK 一起使用,以及我是否应该改用 typesafe-actions。

动作是从 slice.actions 中导出的。我试图将动作转换为 ActionCreatorWithPayload 但它没有帮助。

0 投票
1 回答
1759 浏览

reactjs - 在 redux-toolkit 中使用 combine reducer 重置嵌套状态的最佳方法

假设我的商店带有嵌套的 combineReducers,如下所示

在这种情况下,如果我想将完整的客户状态重置为其初始状态,我该怎么做?

笔记: