问题标签 [redux-actions]

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 投票
2 回答
510 浏览

reactjs - 如何在我的 reducer 中允许多个语句?

我被迫使用redux-actions。在我的减速器中,这段代码有效:

但是,在减速器中我想要console.log一些东西。我该怎么做呢?

0 投票
1 回答
2939 浏览

redux - Redux + Normalizr:在 Redux 状态下添加和删除规范化实体

我有一个包含很多嵌套实体的 API 响应。我使用normalizr来保持 redux 状态尽可能平坦。
例如。api 响应如下所示:

使用下面给出的模式对该响应进行标准化normalizr

下面是它的外观:

redux 状态现在如下所示:

现在,如果我调度一个动作来添加 a tag,那么它会添加一个tag对象,state.tags但它不会更新state.opening.tags数组。删除标签时的行为也相同。

我保留opening,tagsdocs三个不同的减速器。

这是国家的矛盾。我可以想到以下方法来保持状态一致:

  1. tags我调度一个动作来更新标签并在reducer和reducer中收听它,opening然后在两个地方更新标签。
  2. 使用标签更新开头的补丁请求返回开头响应。我可以再次以适当的一致性调度使响应正常化并设置标签、打开等的操作。

这样做的正确方法是什么。实体不应该观察相关实体的更改并自行进行更改。或者有任何其他模式可以遵循任何此类操作。

0 投票
1 回答
101 浏览

reactjs - 当我从第 1 行的 react 向 redux 发送操作时,我可以 100% 确定我的 react 组件中的第 2 行具有更新的 redux 状态吗?

我知道 redux 中的调度操作是同步的。当我从第 1 行的 react 组件向 redux 发送操作时,我可以 100% 确定我的 react 组件中的第 2 行具有更新的 redux 状态吗?我通过调度getGameDataSuccess(data)动作来设置游戏数据。我能 100% 确定在下一行新道具会流下来吗?现在,当console.log(this.props.lostLetters.gameData)我看到新的游戏数据时。但我能 100% 确定这将永远如此吗?

0 投票
2 回答
867 浏览

redux - Redux-Actions handleActions 嵌套化简器

也许我遗漏了一些完全明显的东西,但这让我今天感到不安。

假设我们有一个 Redux 存储,其结构如下:

所以显然有一个主减速器...

然后页面的减速器有每个页面的减速器......

现在我们终于来到了问题的核心,这个特定状态的减速器。

这一切都很好,对吧?好吧,一开始给出的 state 中的 keytableSettings实际上应该由它自己的 reducer 处理。这种模式在 state 中可能存在很多次,所以它被抽象为一个 reducer-creating 函数:

因此,在 state ( accountPageReducer) 部分的 reducer 之上,我们创建了 reducer:

所以问题是,我该放在tableSettingsReducer哪里?

这当然行不通:

它不起作用,因为handleActions期望使用动作常量作为键,而不是状态中的实际键。

也无处可使用combineReducers,因为这个状态片只有一个嵌套的 reducer。currentTab并且fetching不需要自己的reducer,所以使用是没有结果的combineReducers

我知道最近redux-actions开始支持嵌套减速器......但实际上没有任何可用的文档准确显示它应该如何完成,甚至描述实现它所需的参数。

我可以使用combineActions, 并将所有操作组合handleActions到嵌套减速器可以执行的每个操作中。但这似乎不是很干净......另外,如果嵌套减速器有它自己的嵌套减速器怎么办?这意味着每次这些 reducer 可以处理一个新动作时,都需要将该动作添加到combineActions其所有父级中。不是最好的。

想法?

0 投票
1 回答
141 浏览

reactjs - 如何通过 redux-actions 表达 REQUEST / START 动作?

我想使用 redux-actions 来简化我的 react-redux 代码,但我有一个问题:

假设我有“加载”操作,它从远程获取一些主题。所以代码是:

我认为通过一个操作发送结果和错误是件好事。但是如何用相同的动作表达“请求”状态呢?由于上面的代码我没有弄明白,所以我不得不做另一个动作“fetchTopicsRequest()”,这使得整个代码看起来很奇怪。

从早期的讨论中我注意到曾经有一个“状态”字段,在这种情况下它可能会很方便。它去哪儿了?还是我错过了一些更好的主意?

谢谢

0 投票
2 回答
1404 浏览

typescript - 在 typescript 中使用 redux-actions、redux-thunk 和 redux-promise-middleware

这里是 typescript + redux 生态系统的新手。

在 TypeScript 中使用 redux-actions、redux-thunk 和 redux-promise-middleware 时,如何将类型信息正确封装到异步操作中?

身份验证示例:

由于我使用的是 redux-promise-middleware,因此会自动分派actions LOGIN_PENDINGLOGIN_FULFILLED/ 。LOGIN_REJECTED我如何为这些创建类型,以便减速器可以找出它正在处理的操作对象?

由于 redux-actions 遵循 FSA,_FULFILLED所以应该有action.payload. _REJECTED应该有action.error

我将如何创建AuthAction类型?我猜它应该是每个单独动作类型的联合类型(可以是它们自己的联合类型)。redux-actions也为此提供ActionBaseAction类型。

0 投票
1 回答
73 浏览

redux - 使用 redux-actions 时可以提前绑定参数值吗?

我有一个动作和一个传奇。

我想从内部为动作实例提供一个值actions.js

我还想从 saga 内部为动作实例提供一个值。

因此,当调用与动作关联的 reducer 时,它会在有效负载中接收两个值。

我怎样才能做到这一点?

动作.js

sagas.js

减速器.js

0 投票
1 回答
1365 浏览

javascript - 如何在 Redux 操作中的 Promise 中发出多个 API 请求

我正在一个项目中使用 React/Redux,我需要发出 2 个单独的 API 请求,但第二个请求取决于第一个返回而没有任何问题。在下面的操作示例中,我试图将两个调用都包装在一个 Promise 中,但它并不能正常工作(Uncaught Error: Actions must be plain objects. Use custom middleware for async actions.在控制台中出现错误)。由于这两个调用,我不一定需要对响应数据做任何事情。我只需要他们返回 200 状态或错误。

注意:不幸的是,我不能在这个例子中使用 async/await。谢谢!

0 投票
1 回答
387 浏览

javascript - 动作后添加类 onClick React / Redux

例如,我有表格和操作图标“删除”:http: //joxi.ru/gmvzWx4CxKbX5m

单击图标后,在我的 Redux Action 中,我得到 TR 并添加类 'adm-pre-removed'

问题是在调度状态被触发并且渲染发生但类仍然存在之后。

我知道这不是一种反应方式。而且我真的不想在一篇文章中创建一个属性并控制这个类是太多的代码。并且所有此类都应在单击时出现并在状态更改时消失。

您当然可以创建另一个动作并订购 onMouseDown 事件,但这也是很多代码。

哪个选项是正确的以及如何最好地做到这一点?

渲染(控制视图)

渲染组件:

渲染列表:

渲染表:

渲染Tbody:

0 投票
1 回答
58 浏览

reactjs - 如何在反应动作中实现异步动作?

我似乎找不到任何示例来说明如何使用 redux-actions 库实现异步操作。已经搜索了他们的 github 存储库:https ://github.com/reduxactions/redux-actions但似乎找不到任何示例。

redux-action 甚至允许您实现异步操作吗?

寻找任何使用 redux-thunk 执行异步操作的示例。