第十六单元(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. Springboot使用EasyExcel(仅限自己收藏)

    pom文件依赖 <dependency> <groupId>com.alibaba</groupId> <artifactId>easyexcel< ...

  2. 又陷入知识盲区了,面试被问SpringBoot集成dubbo,我当时就懵了

    前言 前两天在和粉丝聊天的时候,粉丝跟我说之前在面试的时候被问到SpringBoot这一块的知识被问的有点懵,和我问了不少这方面的东西.事后我想了想不如把这些东西分享出来吧,让更多的人看到,这样不管是 ...

  3. 面试必看!靠着这份字节和腾讯的面经,我成功拿下了offer!

    准备 敲定了方向和目标后就开始系统准备,主要分为以下几个方面来准备. 算法题 事先已经看过别人的社招面经知道头条每轮技术面都有算法题,而这一块平时练习的比较少,校招时刷的题也忘记了很多.因此系统复习的 ...

  4. 云原生应用Go语言:你还在考虑的时候,别人已经应用实践

    摘要:在近日于上海召开的第六届Gopher China大会上,华为云微服务首席架构师田晓亮分享了<华为云的Go语言云原生实战经验>,讲述如何构建韧性.高可靠.安全的云原生应用系统,并孵化云 ...

  5. Edison:FL Studio中的常用音频录制与剪辑插件

    Edison是FL Studio中的一个完全集成的音频编辑和录制工具.Edison加载到效果插槽(在任何调音台音轨中),然后录制或播放该位置的音频.您可以在任意数量的混音器轨道或效果插槽中根据需要加载 ...

  6. jQuery 第二章 实例方法 DOM操作取赋值相关方法

    取赋值相关方法:  .html() .text() .val() .size() .addClass() .removeClass() .hasClass() .html() html方法干嘛的呢,底 ...

  7. Java反射——java.lang.Class和类的加载

    反射的基础: java.lang.Class Class类的实例对象,用于记录类描述信息. 源码说:represent classes and interfaces in a running Java ...

  8. Window .NetCore Nginx

    1.首先去官网下载Nginx 官网地址:http://nginx.org/en/download.html 2.下载好之后,我的文件是放在D:\InstallFiles\Nginx\nginx-1.1 ...

  9. uniapp cli版本中如何引入scss?

    一.安装依赖 npm i node-sass@4.14.1 sass-loader -D 二.在脚手架版本新建项目成功后,官方为我们准备了uni.scss文件,在这个里面写即可全局使用. ... 一. ...

  10. Beta冲刺随笔——Day_Five

    这个作业属于哪个课程 软件工程 (福州大学至诚学院 - 计算机工程系) 这个作业要求在哪里 Beta 冲刺 这个作业的目标 团队进行Beta冲刺 作业正文 正文 其他参考文献 无 今日事今日毕 林涛: ...