在 Redux 中编写高阶减速器

2024-01-06

我创建了一些工厂函数,为我提供了简单(或更高级)的减速器。例如(简单一 - 基于动作类型集RequestState常数作为值):

export const reduceRequestState = (requestTypes: RequestActionTypes) =>
    (state: RequestState = RequestState.None, action: Action): RequestState => {
        switch (action.type) {
            case requestTypes.start:
                return RequestState.Waiting;
            case requestTypes.success:
                return RequestState.Success;
            case requestTypes.error:
                return RequestState.Error;
            case requestTypes.reset:
                return RequestState.None;
            default:
                return state;
        }
    };

使用这些工厂函数和combineReducers from redux我可以将它们组合成功能齐全的减速器来处理我的大部分休闲动作。这给了我可读的代码并防止我犯愚蠢的错误。

工厂对于常见操作很有用,但是当我需要添加一些自定义行为(对于操作类型)时,这应该显着修改存储的某些部分,我想编写一个减速器的自定义部分来为我处理该操作。 这个想法是以迭代的方式组合减速器,所以combineReducers但对于一个数组。这样我就可以使用我的工厂创建减速器,然后将其与处理某些特定操作的自定义减速器结合起来。这combineReducers对于数组,然后调用第一个数组,认识到没有任何更改并调用第二个(自定义)数组来处理该操作。

我正在寻找一些解决方案并发现redux-actions但不太喜欢它链接操作和化简器的方式,这使得语义与我习惯的没有什么不同。也许我不明白,但最终我喜欢看到我的减速器被编写为纯函数。

我正在寻找一些可以为我指明方向的提示。 是否有任何库或项目使用任何类型的高阶减速器并以某种方式组合它们? 像上面描述的那样组成减速器有什么缺点吗?


是的,因为减速器是just函数,组织逻辑的方式有无数种,将多个函数组合在一起就是非常受鼓舞.

您正在寻找的“数组中的减速器”想法是https://github.com/acdlite/reduce-reducers https://github.com/acdlite/reduce-reducers。我经常在我自己的应用程序中使用它来实现这种行为 - 运行combineReducers- 首先生成减速器,然后依次运行减速器以获得更具体的行为。

我为 Redux 文档编写了一个名为结构化减速器 http://redux.js.org/docs/recipes/StructuringReducers.html,其中涵盖了许多与减速器逻辑相关的主题。这包括超出平常的有用模式combineReducers方法。

我还有一份清单许多其他与减速器相关的实用程序 https://github.com/markerikson/redux-ecosystem-links/blob/master/reducers.md作为我的一部分Redux 插件目录 https://github.com/markerikson/redux-ecosystem-links.

本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)

在 Redux 中编写高阶减速器 的相关文章

  • 向 ReduxReducer 添加回调

    是否有任何错误 反模式 就 React Redux 中的思考 中添加了一个回调action data转化为行动 reducer ACTION FOR REDUCER var x 123 if action data callback act
  • 如何使用 jest 通过 Promise.all 设置多次提取测试

    我在测试中使用 jest 我正在使用 React 和 Redux 并且执行以下操作 function getData id notify return dispatch gt dispatch anotherFunction Promise
  • 重新选择 - 创建一个仅用于获取部分状态的记忆选择器是否有意义?

    我有一个普通的选择器 仅用于获取状态的一部分 export const getAllPosts state gt return state posts 如果我使用重新选择来包装选择器 import createSelector from r
  • React-redux useDispatch() 未捕获类型错误

    我正在尝试创建一个简单的组件来使用 React Redux 钩子分派操作useDispatch 我收到一个错误 我已将组件修剪到发生错误的位置 当调用 useDispatch 函数时会发生这种情况 import useDispatch fr
  • 我应该使用 redux-form 存储而不是组件状态和 Redux 自定义存储吗?

    我相信任何应用程序都应该有一个事实来源 我的应用程序将有 90 多种交易表格和 150 份报告 复杂的数据结构 父级 子级 计算 所以在 React 中我发现了三个令人困惑的存储状态的地方 组件状态 当我们don t想要共享数据 Redux
  • 从 Redux 状态删除一个项目

    我想知道如果可能的话你是否能帮我解决这个问题 我正在尝试从 Redux 状态中删除一个项目 我已经传入了用户点击的项目的IDaction data进入减速机 我想知道如何匹配action data使用 Redux 状态中的 ID 之一 然后
  • 我应该如何使用“redux-thunk”作为异步初始状态? (反应/还原)

    这个问题已经被问过好几次了 但是我并不真正理解我找到的答案 使用 React Redux 我尝试使用 Express 将异步数据放入我的初始状态 因为我习惯了 d3 我的选择之一是使用 d3 json 但如果它更好的话我很乐意使用其他东西
  • React Native + Redux 基本身份验证

    我正在寻找一种为我的反应本机应用程序创建基本身份验证的方法 我找不到任何反应本机应用程序的好例子 要登录 应用程序将电子邮件 密码 clientSecret 发送到我的服务器 如果OK 服务器返回accessToken refreshTok
  • React router + redux 导航回来不会调用 componentWillMount

    目前 我在容器组件的生命周期方法 componentWillMount 中预加载来自 api 的数据 componentWillMount const dept course this props routeParams this prop
  • ant design select占位符问题

    我在我的 React 应用程序中使用 antd design 这是我遇到问题的代码片段
  • React-Redux:操作必须是普通对象。使用自定义中间件进行异步操作

    未处理的拒绝 错误 操作必须是普通对象 使用自定义中间件进行异步操作 我想为每个帖子添加评论 因此 当运行获取帖子时 我想为所有帖子调用获取评论 API export function bindComments postId return
  • Redux如何处理reducer中的错误

    我不确定如何处理 redux 减速器中的错误 当我的 API 获取返回数据时 我需要转换其结构并检查结果数据上设置的各种属性 但是 我不能在减速器中抛出错误 因为 redux 至少需要返回之前的状态 我该如何处理这个问题 注意 我正在使用反
  • 为什么 useReducer 调度会导致重新渲染?

    假设我实现一个简单的全局加载状态 如下所示 hooks useLoading js import React createContext useContext useReducer from react const Context crea
  • 如何编写具有依赖状态的 redux 减速器

    我正在开发一个 React Redux 应用程序 它允许将 小部件 添加到页面并在 2D 空间中进行操作 要求可以同时选择和操作多个小部件 我当前状态树的简化版本如下所示 widgets widget 1 x 100 y 200 widge
  • 理解react-hooks/exhaustive-deps useEffect和调度事件

    我有这个警告 React Hook useEffect has a missing dependency dispatch Either include it or remove the dependency array react hoo
  • 如何修复 React-Redux 应用程序中的 431 请求标头字段过大

    我正在 YouTube 上使用 Redux 完成 MERN 注册 登录身份验证教程 当尝试在 Postman 中将测试用户 POST 到服务器时 我收到 431 标头请求太大错误响应 我在一些地方读到清除浏览器中的缓存 历史记录是有效的 所
  • 如何检查令牌过期和注销用户?

    当用户单击注销按钮时 他 她可以自己注销 但是如果令牌过期 他 她就无法注销 因为在我的应用程序中 令牌在服务器端和前端都使用 当用户单击注销按钮时 如果令牌有效 则服务器和浏览器中的令牌都会被清除 当用户未注销并且他 她的令牌过期但未在浏
  • 使用 ngrx 时调度完成后执行代码

    在我的示例 Angular 2 应用程序中 我使用 ngrx store 和 ngrx effects 进行状态管理 下面是组件中添加新项目的函数之一 addAuthor this store dispatch addAuthorActio
  • Redux - 异步加载初始状态

    我正在尝试找出最简洁的方法来加载来自 API 调用的 Redux 存储的初始状态 据我所知 提供初始状态的典型方法是在页面加载时在服务器端生成它 并将其作为简单对象提供给 Redux createStore 但是 我正在编写一个应用程序 计
  • 浸入草稿,计算属性

    我不确定为什么我会得到Error Immer drafts cannot have computed properties在我的减速器代码中 我在用着redux starter kit它用 Immer 库包装了我的所有减速器代码 我不太确定

随机推荐

  • Cocos2D 2.0 - 无数的 OpenGL 错误

    我正在将 Cocos2D 项目转换为 2 0 我使用Cocos2D 2 0模板 没有物理的简单模板 创建了一个空白项目 并将所有文件从旧项目转移到空白项目 我也将其转换为 ARC 我编译并没有看到任何错误 我运行该应用程序 它似乎运行正常
  • Thymeleaf:添加现有值而不是替换它们

    有没有办法告诉Thymeleaf将参数添加到标签而不是覆盖它们 Example div class a 应该导致 div class a b or div class a c Regards 另一种方法是 th attr class a x
  • Pandas to_datetime 不适用于空值

    是的 我会尽可能说清楚 这是我的数据框base varlist2 completion date latest completion date original customer birth date 1 0 07 10 2004 17 0
  • 将我的ApplicationsDbContext 与IdentityDbContext 结合使用MVC 5 没有定义键

    我将现有的 DBContext 与 MVC 5 中的新 IdentityDbContext 组合起来 我设法组合了这两个上下文 但是当我运行应用程序并创建模型时 出现以下错误消息 Context IdentityUserLogin Enti
  • 如何正确处理和保留系统关闭(和 SIGTERM)以完成 Python 中的工作?

    基本需求 我有一个 Python 守护进程 它通过 os system 调用另一个程序 我的愿望是能够正确处理系统关闭或SIGTERM 以便让被调用的程序返回然后退出 我已经尝试过的 我尝试过使用信号的方法 import signal ti
  • 如何调整 NumericVector 的大小?

    如何在 Rcpp 中调整大小NumericVector 当我使用push back为此 程序会变慢 但没有 resize or reserve 功能 当我已经有一个NumericVector有了所需的大小 我可以使用复制构造函数来获取正确的
  • CreateProcess 如何定位可执行文件?

    根据文档 创建进程 http msdn microsoft com en us library ms682425 28v vs 85 29 aspx可以传递可执行文件名称 作为第一个参数 或命令行作为第二个参数 从中 将提取可执行文件名称
  • Python 中的 Perl 兼容正则表达式 (PCRE)

    我必须在 Python 中解析一些基于 PCRE 的字符串 但我不知道该怎么做 我想要解析的字符串如下所示 match mysql m 0 0 0 n 4 w 0 0 s p MySQL i 1 在这个例子中 我必须获得这些不同的项目 m
  • 如何在c#中截断文件?

    我正在使用 Trace Writeln 函数将 C 程序完成的操作写入文件中 但文件变得太大 当这个文件增长到1MB时如何截断它 TextWriterTraceListener traceListener new TextWriterTra
  • 比较:reCaptcha 安全首选项

    比较 reCaptcha 安全首选项 任何人都可以向我指出文档 在其中我可以看到 对用户来说最简单 最安全 和 在 之间 之间的差异吗 谢谢 可用性和安全性之间始终存在斗争 人机交互讲师南江说道 https www wired co uk
  • 如何使用 Go 部分解析 JSON?

    我有以下 json app name name of app version 1 items type type of item inputs input1 value1 The items 0 inputs改变基于items 0 type
  • 使用条件语句从 pandas df 列中减去标量给出 ValueError: The true value of a Series is ambigacy

    我正在尝试执行 if df trades loc CASH 0 df trades loc CASH commission 然后我得到了错误 df trades loc CASH 是一列浮点数 我想减去标量commission从该列中的每个
  • 隐藏 Firefox 附加组件中的位置栏

    在我的附加组件中 我有一个在安装 更新时显示的 HTML 页面 Firefox 显然显示了页面的 chrome URI 我试图找出如何防止这种情况发生 只是出于美观原因 请注意 我知道某些附加组件能够隐藏某些选项卡 页面上的位置栏 它们是如
  • 是否可以在 VSCode 中使编辑器全屏拆分?

    我希望有能力制作多个之一split编辑器窗口全屏 我通常有两个带有代码的垂直分割窗口 这将很有用全屏缩放没有资源管理器终端和所有其他栏 只需代码 最初我有以下内容 但我想配置一个快捷方式使活动窗口全屏显示 如下所示 就像F11一样 关闭资源
  • 如何禁用表单提交按钮“a là Ruby on Rails Way”?

    我正在使用 Ruby on Rails 3 我想disable and 切换 CSS 类 of a form submit 当表单被 AJAX 提交时 直到 AJAX HTTP 请求完成 我正在使用 JavaScript 的默认 jQuer
  • R 从关注者列表中查找对用户推文的所有回复

    我试图找出用户对所有给定推文的回复数量 这不能直接从 Twitter 的 API 获得 我决定只关注用户关注者的回复 以帮助提炼生成的数据并作为一个很好的近似值 我相信对推文的大部分回复将直接来自该用户关注者 我相信我已经取得了很大的进步
  • Python 2.7.9 Mac OS 10.10.3 消息“setCanCycle:已弃用。请改用 setCollectionBehavior”

    这是我的第一条消息 我希望你能帮助我解决我的问题 当我启动 python 脚本时 我收到以下消息 2015 06 10 23 15 44 146 python 1044 19431 setCanCycle 已弃用 请改用 setCollec
  • 需要数据库结构建议

    我目前正在开发一个包含产品目录的网站 我对数据库设计有点陌生 所以我正在寻找有关如何最好地做到这一点的建议 我熟悉关系数据库设计 所以我理解 多对多 或 一对多 等 在大学学过很好的数据库课程 以下是一个项目可能被分类为的示例 Propel
  • 如何使 Uri.EscapeDataString 符合 RFC 3986

    Uri 类默认为 RFC 2396 对于 OpenID 和 OAuth 我需要与 RFC 3986 一致的 Uri 转义 来自System Uri 类文档 http msdn microsoft com en us library syst
  • 在 Redux 中编写高阶减速器

    我创建了一些工厂函数 为我提供了简单 或更高级 的减速器 例如 简单一 基于动作类型集RequestState常数作为值 export const reduceRequestState requestTypes RequestActionT