第十七单元(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. 「LOJ 539」「LibreOJ NOIP Round #1」旅游路线

    description 题面较长,这里给出题目链接 solution 考虑预处理出\(f[i][j]\)表示在第\(i\)个点加满油后,从第\(i\)个点出发,至多消耗\(j\)元钱走过的最大路程,那 ...

  2. 【PYTEST】第二章编写测试函数

    知识点: assert 测试函数标记 跳过测试 标记预期失败的测试用例 1. asseet 返回的都是布尔值,等于False(F) 就是失败, assert 有很多 assert something ...

  3. 【VUE】4.配置axios发起请求

    1.配置axios 1. 前端请求后端接口进行数据交互的时候,需要配置axios 2. 导入axios包, main.js import axios from 'axios' 3. 挂载到原型配置上, ...

  4. Centos7安装vscode

    CentOS7 安装vscode                              最近在Linux环境下写几个程序时发现用vim时总出现一点问题,配置了vim也还是不太习惯,因此就安装了vs ...

  5. 上位机学习技巧——c#(原创)

    (一直更新.......) 一.扫描可用串口 二.捕获鼠标移到控件(上升沿)/离开控件(下降沿) 在窗体生成代码中,找到对应按钮(这里使用butten1)区域,在区域内添加两个事件,分别是: 鼠标移到 ...

  6. sentinel配置

    登陆接口 QPS5,异常0.8,熔断10s 1.异地登陆同省逻辑降级security 2.可疑用户判断certification 3.是否是危险设备判断account 4.是否是自动化imei,ime ...

  7. 【译】理解Rust中的局部移动

    原文标题:Understanding Partial Moves in Rust 原文链接:https://whileydave.com/2020/11/30/understanding-partia ...

  8. charles 常用功能 (六)抓包结果列表指展示关注的接口(focus on 功能)

    添加关注的接口 2.启用关注接口,添加过滤的地址 3.重新抓包结果 不在上一步配置中的接口,都会隐藏在other host中

  9. 大数据开发-Hive-常用日期函数&&日期连续题sql套路

    前面是常用日期函数总结,后面是一道连续日期的sql题目及其解法套路. 1.当前日期和时间 select current_timestamp -- 2020-12-05 19:16:29.284 2.获 ...

  10. SpringCloud 源码系列(3)—— 注册中心 Eureka(下)

    十一.Eureka Server 集群 在实际的生产环境中,可能有几十个或者几百个的微服务实例,Eureka Server 承担了非常高的负载,而且为了保证注册中心高可用,一般都要部署成集群的,下面就 ...