第十七单元(redux和组件之间的通信，react-redux的相关api的用法)

#课程目标

  1. 什么是redux-redux
  2. react-redux的作用是什么
  3. react-redux如何应用

#知识点

  1. redux与react结合起来的工具
  2. 当一个react项目组件层级越来越深，页面越来越多的时候，数据在各个组件层级和页面之间传递的需求就会比较多，很多变量也需要做成可全局管理的。
  3. Provider
  4. connect([mapStateToProps], [mapDispatchToProps], [mergeProps], [options])

#授课思路

#案例和作业

  1. 完成城市选择功能

    素材和源码/第十七单元/pick.png

  2. react-redux跨路由传参

    素材和源码/第十七单元/city.png

react第十七单元(redux和组件之间的通信，react-redux的相关api的用法)的更多相关文章

  1. react 组件之间的通信

    react推崇的是单向数据流,自上而下进行数据的传递,但是由下而上或者不在一条数据流上的组件之间的通信就会变的复杂.解决通信问题的方法很多,如果只是父子级关系,父级可以将一个回调函数当作属性传递给子级 ...

  2. 使用reflux进行react组件之间的通信

    前言 组件之间为什么要通信?因为有依赖. 那么,作为React组件,怎么通信? React官网说, 进行 父-子 通信,可以直接pass props. 进行 子-父 通信,往父组件传给子组件的函数注入 ...

  3. react native 之子组件和父组件之间的通信

    react native开发中,为了封装性经常需要自定义组件,这样就会出现父组件和子组件,那么怎么在父组件和子组件之间相互通信呢,也就是怎么在各自界面push和pop.传值. 父组件传递给子组件: 父 ...

  4. React 学习(六) ---- 父子组件之间的通信

    当有多个组件需要共享状态的时候,这就需要把状态放到这些组件共有的父组件中,相应地,这些组件就变成了子组件,从而涉及到父子组件之间的通信.父组件通过props 给子组件传递数据,子组件则是通过调用父组件 ...

  5. react 实现组件嵌套以及子组件与父组件之间的通信

    当子组件触发onChange事件时,实际调用的是父组件中的handelSelect函数,通俗来说就是父组件通过属性handleSelect实现与子组件之间的通信. 父组件:SignupForm 子组件 ...

  6. react8 组件之间的通信

    <body><!-- React 真实 DOM 将会插入到这里 --><div id="example"></div> <!- ...

  7. js组件之间的通信

    应用场景: 1.在刷微博的时候,滑到某个头像上,会出现一张usercard(用户名片), 微博列表区有这个usercard, 推荐列表也有这个usercard,评论区也有. 2.在网上购物时,购物车安 ...

  8. Intent实现Activity组件之间的通信

    今天讲解的是使用Intent实现Activity组件之间的通信. 一.         使用Intent显式启动Activity,Activity1àActivity2 1.             ...

  9. 使用Broadcast实现android组件之间的通信 分类： android 学习笔记 2015-07-09 14:16 110人阅读 评论(0) 收藏

    android组件之间的通信有多种实现方式,Broadcast就是其中一种.在activity和fragment之间的通信,broadcast用的更多本文以一个activity为例. 效果如图: 布局 ...

随机推荐

  1. 牛客练习赛60E 旗鼓相当的对手

    dsu on tree 题目链接 点我跳转 题目大意 给你一棵以\(1\)为根节点,包含\(n\)个节点的树和一个参数 \(k\),求每个节点的"\(rating\)" \(rat ...

  2. 总结MathType中输入小于号的方法

    作为一款专业的公式编辑软件,MathType可谓是非常强大,先不说其编辑公式是多么的方便.迅速,但就打开软件界面,看到不可估算的数学符号有那么多,你就会感叹它的强大,竟然能把绝大部分的数学符号都汇聚于 ...

  3. 关于Vegas制作黑白负片爆闪效果的教程分享

    作为一款视频剪辑软件,Vegas界面简洁,操作难度低,比较容易上手,今天小编就带大家了解Vegas制作超级炫酷的黑白负片爆闪效果的操作过程. 1.导入视频 首先,双击打开视频剪辑软件Vegas Pro ...

  4. 337. 打家劫舍 III（树上dp）

    在上次打劫完一条街道之后和一圈房屋后,小偷又发现了一个新的可行窃的地区.这个地区只有一个入口,我们称之为"根". 除了"根"之外,每栋房子有且只有一个" ...

  5. yii2.0 curl的使用

    yii2 curl的使用办法 get: use linslin\yii2\curl; public function actionCurl($value =0) { $url = 'http://ya ...

  6. acm 易错警示

    1:建图注意是有向图还是无向图,无向开两倍数组 2:看题注意是否为多组输入,多组输入注意初始化. 3:减法取模一定要注意 4:stl中.size()为unsigned如果要计算注意强制类型转换(int ...

  7. 如何解决vue2.0 打包之后 打开index.html出现空白页

    如何解决vue2.0 打包之后 打开index.html出现空白页 1.打包之前修改三个文件       1.1.第一步,找到build文件,在webpack.prod.conf.js 第25行左右 ...

  8. MySQL中的事务原理和锁机制

    本文主要总结 MySQL 事务几种隔离级别的实现和其中锁的使用情况. 在开始前先简单回顾事务几种隔离级别以及带来的问题. 四种隔离级别:读未提交.读已提交.可重复读.可串行化. 带来的问题:脏读.不可 ...

  9. 一道百度java面试题的多种解法

    下面是我在2018年10月11日二面百度的时候的一个问题: java程序,主进程需要等待多个子进程结束之后再执行后续的代码,有哪些方案可以实现? 这个需求其实我们在工作中经常会用到,比如用户下单一个产 ...

  10. ModelSim入门

    verilog设计进阶 时间:2014年5月5日星期一 主要收获: 1. 安装了ModelSim ALTERA 6.4a; 2. 熟悉基本流程,仿真成功: 3. 了解testbench语法基本. 为什 ...