第十六单元(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. 新鲜出炉!两万月薪的Java工程师面试题,看看你能做出来多少?

    接口和抽象类的区别 接口. 一个类实现了多个接口,那么必须实现接口中所有的抽象方法,如果方法相同,那么只需要Override一次. 所有接口中的默认方法也可以被继承,但是如果两个接口有重名的默认方法, ...

  2. 交换机通过Loopback Detection检测(接口自环)

    组网图形  Loopback Detection简介 网络中的环路会导致设备对广播.组播以及未知单播等报文进行重复发送,造成网络资源浪费甚至网络瘫痪.为了能够及时发现二层网络中的环路,避免对整个网络造 ...

  3. FL Studio水果音乐制作入门教程

    "没有早期音乐教育,干什么事我都会一事无成".这并非某位音乐家精心熬制的心灵鸡汤,而是出自物理学家爱因斯坦之口,朋友们没有看错,就是那个被称为二十世纪伟大科学家的爱因斯坦,所以,别 ...

  4. Vuex form表单处理, 比官网更好的办法

    Vuex form表单处理, 比官网更好的办法 问题, 当使用vuex的state作为表单的v-model元素, 虽然简单粗暴, 但这种修改没有经过mutation方法. 在严格模式下会抛出错误 目录 ...

  5. 小米死磕硬核技术,将扩招5000名工程师,多个领域会使用到C++

    小米MIDC大会2020在北京小米科技园召开,小米集团创始人.集团董事长兼CEO雷军宣布:"重视人才队伍的建设.人才是创新之源,提升技术实力的第一步,就是聚拢最顶尖的人才.小米2021年将在 ...

  6. markdown语法和数学公式

    目录 Markdown简介 代码块 LaTeX 公式 表格 LaTeX 矩阵公式 Markdown简介 Markdown 是一种轻量级标记语言,它允许人们使用易读易写的纯文本格式编写文档,然后转换成格 ...

  7. 小叶入门之Python爬虫(一)

    一.Python简洁的简介 Python是一种跨平台的计算机程序设计语言.它是一个高层次的结合了解释性.编译性.互动性和面向对象的脚本语言.最初被设计用于编写自动化脚本(shell),随着版本的不断更 ...

  8. java顺序、选择、循环结构

    一.顺序结构 二.选择结构 1.if都执行 2.if else if else 条件满足才执行 3.选择结构switch 一个case后有多条语句要加花括号 多个case的值不能相同 case中要加b ...

  9. 对称加密之---AES加密

    工作中常会需要让数据传输前进行加密处理.这次用到的是AES加密.AES加密中,需要注意到坑还是挺多的.对AES也进行了一番了解,发现里面的东西真的是注意的太多了.今天只是整理了一种简单的加密格式,工作 ...

  10. PyQt(Python+Qt)学习随笔:QMainWindow的addDockWidget方法增加QDockWidget停靠窗到主窗口

    专栏:Python基础教程目录 专栏:使用PyQt开发图形界面Python应用 专栏:PyQt入门学习 老猿Python博文目录 DockWidget除了放在QMainWindow窗口内外,也可以放在 ...