第十七单元(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. Cypress系列（90）- Cypress.Cookies 命令详解以及如何跨测试用例共享 Cookies

    如果想从头学起Cypress,可以看下面的系列文章哦 https://www.cnblogs.com/poloyy/category/1768839.html Cypress.Cookies 共有三个 ...

  2. Mac如何像Windows一样在文件系统中查看文件?

    许多Windows系统用户刚转向Mac的时候,肯定非常不适应Mac系统独特的文件系统,就像安卓转iOS系统一样,那么Mac电脑如何像Windows系统一样,能够查看电脑上的各个盘,如C盘D盘等等,然后 ...

  3. css3系列之详解box-shadow

    box-shadow box-shadow呢 是设置元素的阴影效果的,利用这个属性,可以设计很多很炫丽的效果,不信? 等下,学完,我们就来完成下面这两个效果 首先 先了解一下,box-shadow 的 ...

  4. celery配置与基本使用

    目录 1.celery配置与基本使用 1.1 安装celery 2.测试celery 2.1启动celery 1.celery配置与基本使用 1.1 安装celery # celery_task/ma ...

  5. python批量生成SQL语句

    1,首先写一条能运行成功插入SQL的语句 INSERT INTO sign_guest(realname,phone,email,sign,event_id)VALUES("jack&quo ...

  6. web服务器是啥

    什么是web服务器 参考 https://www.cnblogs.com/zhaoyl/archive/2012/10/10/2718575.html 了解nginx之前,先了解下什么是web服务器吧 ...

  7. dubbo ChannelHandler

    记得我们在做服务暴露的bind和服务调用的connect都有一个ExchangeHandler的实例作为入参: 这个handler最终会利用装饰者模式被封装若干层,Dubbo中提供了大量的Handle ...

  8. @Async失效之谜

    @Async如何使用 异步的方法上加上@Async异步注解 启动类中需要加上@EnableAsync才有效 使用时类似于下列函数: new Thread(()-> System.out.prin ...

  9. Java 关于策略模式+简单工厂模式下的思考

    导读 最近在做公司一个消息网关的服务,包括:短信.微信.邮件等,所有请求通过一个入口,方便接口的管理(记录日志.接口限流白名单啥的).如何写这个接口呢,还有为了以后扩展,对接过短信.微信.公众号的童鞋 ...

  10. 不是程序员，代码也不能太丑！python官方书写规范：任何人都该了解的 pep8

    不是程序员,代码也不能太丑!python官方书写规范:任何人都该了解的 pep8 简介:为什么要强调 书写规范 ?这其实并不关乎"美丑",而是为了 更高的效率(代码阅读.开发.维护 ...