第十六单元(redux的认识,redux相关api的掌握)

#课程目标

  1. 掌握组件化框架实现组件之间传参的几种方式,并了解两个没有任何关系组件之间通信的通点
  2. 了解为了解决上述通点诞生的flux架构
  3. 了解单向数据流及在redux结合react组件之间的数据流向
  4. 掌握redux的三大原则,单一数据源,state是只读的和使用纯函数来修改执行

#知识点

  1. 掌握redux数据流向

    • 调用 store.dispatch(action)
    • Redux store 调用传入的 reducer 函数
    • 根 reducer 应该把多个子 reducer 输出合并成一个单一的 state 树
    • Redux store 保存了根 reducer 返回的完整 state 树
  2. 掌握redux中的数据存储state

  3. 掌握action的概念,及结合业务场景定义action

{
type: ADD_TODO,
text: 'Build my first Redux app'
}
 
  1. 在reduce里接受action,并返回心的state
switch (action.type) {
case SET_VISIBILITY_FILTER:
return Object.assign({}, state, {
visibilityFilter: action.filter
})
default:
return state
}
 
  1. 掌握获取redux数据的getState和派发action的dispatch方法

  2. 掌握组件订阅redux数据的subscribe和unsubscribe方法

#授课思路

#案例和作业

    1. 使用redux解决react组件完成计数器的开发

    2. 使用redux改写组件传参的购物车

react第十六单元(redux的认识,redux相关api的掌握)的更多相关文章

  1. linux基础-第十六单元 yum管理RPM包

    第十六单元 yum管理RPM包 yum的功能 本地yum配置 光盘挂载和镜像挂载 本地yum配置 网络yum配置 网络yum配置 Yum命令的使用 使用yum安装软件 使用yum删除软件 安装组件 删 ...

  2. vue第十六单元(element-ui vue-lazyload 等常用插件)

    第十六单元(element-ui vue-lazyload 等常用插件) #课程目标 1.掌握插件的引入方式 2.精通UI框架 3.掌握前端常见的几种效果实现 #知识点 一.elementUI的使用 ...

  3. react第十九单元(react+react-router-dom+redux综合案例1)

    第十九单元(react+react-router-dom+redux综合案例1) #课程目标 复习 综合练习 实战能力 #知识点 react react-router redux #授课思路 #案例和 ...

  4. react第十八单元(redux中间件redux-thunk,redux工程目录的样板代码,规范目录结构)

    第十八单元(redux中间件redux-thunk,redux工程目录的样板代码,规范目录结构) #课程目标 中间件:中间件增强redux的可扩展性,实现功能复用的目的. redux-thunk异步逻 ...

  5. react第十二单元(react路由-使用react-router-dom-认识相关的组件以及组件属性)

    第十二单元(react路由-使用react-router-dom-认识相关的组件以及组件属性) #课程目标 理解路由的原理及应运 理解react-router-dom以及内置的一些组件 合理应用内置组 ...

  6. react第十五单元(react路由的封装,以及路由数据的提取)

    第十五单元(react路由的封装,以及路由数据的提取) #课程目标 熟悉react路由组件及路由传参,封装路由组件能够处理路由表 对多级路由能够实现封装通用路由传递逻辑,实现多级路由的递归传参 对复杂 ...

  7. react第十四单元(react路由-react路由的跳转以及路由信息)

    第十四单元(react路由-react路由的跳转以及路由信息) #课程目标 理解前端单页面应用与多页面应用的优缺点 理解react路由是前端单页面应用的核心 会使用react路由配置前端单页面应用框架 ...

  8. 第十六单元 yum管理RPM包

    yum的功能 本地yum配置 光盘挂载和镜像挂载 本地yum配置 网络yum配置 网络yum配置 Yum命令的使用 使用yum安装软件 使用yum删除软件 安装组件 删除组件 清除缓存 查询 课后作业 ...

  9. Linux学习之十六、文件的格式化与相关处理

    原文地址:http://vbird.dic.ksu.edu.tw/linux_basic/0330regularex_4.php 文件的格式化与相关处理 接下来让我们来将文件进行一些简单的编排吧!底下 ...

随机推荐

  1. 面试官:就问个Spring容器初始化和Bean对象的创建,你讲一小时了

    前言 spring作为一个容器,可以管理对象的生命周期.对象与对象之间的依赖关系.可以通过配置文件,来定义对象,以及设置其与其他对象的依赖关系. main测试类 public static void ...

  2. 【PYTHON】操作excel笔记

    import xlrd book = xlrd.open_workbook('..//data//case1.xls') # 获取excel对象 print(book.sheets()) # 获取ex ...

  3. 《SpringBoot第一篇:HelloWorld启蒙》

    每篇一律 云对雨,雪对风,晚照对晴空. 来鸿对去雁,宿鸟对鸣虫. --<声律启蒙·一东> 什么是Spring Boot SpringBoot 是为了简化 Spring 应用的创建.运行.调 ...

  4. 返回当前类所有常量的Key=>value 集合

    <?php class Test { const A = '1'; const B = '2'; const C = '3'; const D = '4'; const E = '5'; con ...

  5. 添加mysqli扩展

    find / -name phpize 进入mysqli目录下 ./configue -prefix=/usr/local/mysqli . make && make install ...

  6. Gradle全局代理配置

    配置文件路径:C:\Users\myName\.gradle\gradle.properties 代理配置内容: systemProp.http.proxyHost=127.0.0.1 systemP ...

  7. 《STM32CubeMX配置STM32H743XI工程》第一讲《初始化UART,重定义printf函数,点亮一个LED灯》

    1.打开STM32CubeMX软件->新建一个工程(软件自行到ST官网下载安装) 2.输入对应的芯片型号(本次基于野火STM32H743XI Pro 开发板)点击Start Project生成项 ...

  8. sqli-labs-master less06

    第六关与第五关步骤无区别,请参考 sqli-labs-master less05 及 Burp Suite暴力破解示例 区别:在第二步判断注入类型时发现 加单引号与不加单引号没有区别,加双引号时报错, ...

  9. Docker实战 | 第一篇:Centos8 安装 Docker

    1. 安装依赖包 yum install -y yum-utils device-mapper-persistent-data lvm2 2. 配置镜像源 yum config-manager --a ...

  10. 【NOIP2015模拟11.5】JZOJ8月5日提高组T2 Lucas的数列

    [NOIP2015模拟11.5]JZOJ8月5日提高组T2 Lucas的数列 题目 PS:\(n*n*T*T<=10^{18}\)而不是\(10^1*8\) 题解 题意: 给出\(n\)个元素的 ...