今天看前辈写的代码,看到mapStateToProps&&mapDispatchToProps处,不明白,于是又是各种找资料,在CSDN博客中发现一篇好文,摘抄到此,方便自己阅读!

原文如下:http://blog.csdn.net/genius_yym/article/details/64130120

在react-redux开发中每个模块有自己的state用来统一管理视图数据

(1)将需要的state的节点注入到与此视图数据相关的组件上

使用 React Redux 库的 connect() 方法来生成容器组件前,需要先定义 mapStateToProps 这个函数来指定如何把当前 Redux store state 映射到展示组件的 props 中。

 

(2)将需要绑定的响应事件注入到组件上

除了读取 state,容器组件还能分发 action。类似的方式,可以定义mapDispatchToProps() 方法接收 dispatch() 方法并返回期望注入到展示组件的 props 中的回调方法。它可以是一个函数,也可以是一个对象。如果mapDispatchToProps是一个函数,会得到dispatch和ownProps(容器组件的props对象)两个参数。

 
 

(3)统筹mapStateToProps和mapDispatchToProps

 

最后,说一下react-redux开发的基本结构。

开发环境调用后台路径配置:`proxy.config.js`文件下可以自由定义接口调用到的后台地址,业务模块不要出现应用路径(BackGround);各个模块目录下:- api.js定义与后台交互的接口方法- action.js定义页面操作触发的动作(eg. 点击查询按钮)- reducer.js定义触发动作后的影响(eg. 查询完成后将查询结果set回state,视图自动刷新)

补充:自己项目实例(aec-app):

 

react依赖注入之mapStateToProps&&mapDispatchToProps的更多相关文章

  1. 使用react全家桶制作博客后台管理系统 网站PWA升级 移动端常见问题处理 循序渐进学.Net Core Web Api开发系列【4】:前端访问WebApi [Abp 源码分析]四、模块配置 [Abp 源码分析]三、依赖注入

    使用react全家桶制作博客后台管理系统   前面的话 笔者在做一个完整的博客上线项目,包括前台.后台.后端接口和服务器配置.本文将详细介绍使用react全家桶制作的博客后台管理系统 概述 该项目是基 ...

  2. React 源码中的依赖注入方法

    一.前言 依赖注入(Dependency Injection)这个概念的兴起已经有很长时间了,把这个概念融入到框架中达到出神入化境地的,非Spring莫属.然而在前端领域,似乎很少会提到这个概念,难道 ...

  3. Z从壹开始前后端分离【 .NET Core2.2/3.0 +Vue2.0 】框架之八 || API项目整体搭建 6.3 异步泛型仓储+依赖注入初探

    本文梯子 本文3.0版本文章 回顾 1.Sqlsugar 的使用 2.修改数据连接字符串 今天要完成的浅紫色部分 一.设计仓储基类接口——IBaseRepository.cs 二.将其他的仓储接口,继 ...

  4. Vue3 与依赖注入

    Vue3 与依赖注入 本文写于 2021 年 2 月 19 日 在 React 中,我们可以通过 context 与 useContext 实现单例.注入--等诸多特性. 详细请看上一篇文章:如何利用 ...

  5. webapi - 使用依赖注入

    本篇将要和大家分享的是webapi中如何使用依赖注入,依赖注入这个东西在接口中常用,实际工作中也用的比较频繁,因此这里分享两种在api中依赖注入的方式Ninject和Unity:由于快过年这段时间打算 ...

  6. ASP.NET Core 中文文档 第四章 MVC(3.8)视图中的依赖注入

    原文:Dependency injection into views 作者:Steve Smith 翻译:姚阿勇(Dr.Yao) 校对:孟帅洋(书缘) ASP.NET Core 支持在视图中使用 依赖 ...

  7. 在WPF中使用依赖注入的方式创建视图

    在WPF中使用依赖注入的方式创建视图 0x00 问题的产生 互联网时代桌面开发真是越来越少了,很多应用都转到了浏览器端和移动智能终端,相应的软件开发上的新技术应用到桌面开发的文章也很少.我之前主要做W ...

  8. MVVM模式解析和在WPF中的实现(六) 用依赖注入的方式配置ViewModel并注册消息

    MVVM模式解析和在WPF中的实现(六) 用依赖注入的方式配置ViewModel并注册消息 系列目录: MVVM模式解析和在WPF中的实现(一)MVVM模式简介 MVVM模式解析和在WPF中的实现(二 ...

  9. .Net Core MVC 网站开发(Ninesky) 2.3、项目架构调整-控制反转和依赖注入的使用

    再次调整项目架构是因为和群友dezhou的一次聊天,我原来的想法是项目尽量做简单点别搞太复杂了,仅使用了DbContext的注入,其他的也没有写接口耦合度很高.和dezhou聊过之后我仔细考虑了一下, ...

随机推荐

  1. Delphi XE2 之 FireMonkey 入门(16) - 滤镜: 实例测试

    窗体上需要 TImage.TOpenDialog 和六个按钮. unit Unit1; interface uses   System.SysUtils, System.Types, System.U ...

  2. Delphi XE2 之 FireMonkey 入门(6) - TLine、TEllipse、TCircle、TPie、TArc、TRectangle、TRoundRect、TCalloutRectangle

    它们都是继承自 TShape 类, 共同拥有如下属性: Fill            : TBrush;      //填充 Stroke          : TBrush;      //边线( ...

  3. 阶段1 语言基础+高级_1-3-Java语言高级_1-常用API_1_第5节 String类_4_字符串的比较相关方法

    字符串的常用方法 equals是对内容的比较 直接用字符串.equals 小写的h和大写的H肯定是不一样的 推荐和不推荐的写法 运行程序不会报任何的错误 如果把str5设置为null.那么推荐的写法返 ...

  4. myeclipse 2015 myeclipse2010破解共存

    1.高版本选择bling版本,低版本选择profession版本2.用高版本的公钥替换低版本的公钥3.先破解低版本的后破解高版本的4.最后用高版本的替换低版本的文件

  5. lombok 简化 get set toString hash equals等方法

    1.lombok 在项目中使用Lombok可以减少很多重复代码的书写.比如说getter/setter/toString等方法的编写. 2.安装 下载 https://projectlombok.or ...

  6. git_02_git常用操作命令

    前言 Git是一个开源的分布式版本控制系统,可以有效.高速地处理从小到大的项目版本管理.编写自动化测试脚本的过程中,经常要用到git命令,但总是记不住,每次都要百度有些麻烦.于是为了方便使用,在这总结 ...

  7. 基于3ds Max的游戏建模方案

    前言 需求 由于本游戏的设计,需求使用到角色以及场景建模.具体模型的搭建与贴图的设计根据原画进行. 工具 一般在游戏研发中,模型的搭建主要使用以下工具和概念来渲染建模. 3ds Max 3ds Max ...

  8. Model Inversion Attack Paper Indexpage

    Paper [1]: White-box neural network attack, adversaries have full access to the model. Using Gradien ...

  9. 第四周课程总结&试验报告

    实验二 Java简单类与对象 实验目的 掌握类的定义,熟悉属性.构造函数.方法的作用,掌握用类作为类型声明变量和方法返回值: 理解类和对象的区别,掌握构造函数的使用,熟悉通过对象名引用实例的方法和属性 ...

  10. 如何在Web工程中实现任务计划调度

    转载自: http://www.oschina.net/question/146385_37793?sort=time 下面就Servlet侦听器结合Java定时器来讲述整个实现过程.要运用Servl ...