第十六单元(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设计模式中的原型模式,看完就没有说不懂的

    前言 原型模式(Prototype模式)是指:用原型实例指定创建对象的种类,并且通过拷贝这些原型,创建新的对象 原型模式是一种创建型设计模式,允许一个对象再创建另外一个可定制的对象,无需知道如何创建的 ...

  2. pandas 对时间索引进行分割

    截取最近1个月时间,截取最近一段时间,进行统计分析 df.loc["2016-01-05":"2016-02-05",:].tail() 在index为有序数据 ...

  3. 在linux系统中通过fw_printenv查看和设置u-boot中的环境变量

    uboot下可以通过命令访问(printenv)和修改环境变量(setenv),但是如果需要在Linux系统下访问这些数据该怎么办呢?其实uboot早就帮我们想好了.  1.编译fw_printenv ...

  4. 缓存模式(Cache Aside、Read Through、Write Through、Write Behind)

    目录 概览 Cache-Aside 读操作 更新操作 缓存失效 缓存更新 Read-Through Write-Through Write-Behind 总结 参考 概览 缓存是一个有着更快的查询速度 ...

  5. 理解go语言的shellcode加载器

    序言 本文假设你知道unsafe包常见函数的用法,若否,请查看 https://books.studygolang.com/gopl-zh/ch13/ch13-01.html  第13章. 例子和代码 ...

  6. LIKE 运算符

    运算符用于执行程序代码运算,会针对一个以上操作数项目来进行运算.例如:2+3,其操作数是2和3,而运算符则是"+".在vb2005中运算符大致可以分为5种类型:算术运算符.连接运算 ...

  7. 三:robot framework常用关键字

    该部分介绍的是内置库:Builtin,估不需要导入,即可使用 1.RF中定义一个变量: ${XXX}   XXX表示:变量名 *** Settings *** *** Test Cases *** 定 ...

  8. fastjson JSONObject简单使用

    工作中用的蛮多的最近整理下,概括地说 通过这个工具可以让一个json在json串,JSONObject,java对象之间进行转化 首先我们先写2个bean来构成一个比较复杂的json串: public ...

  9. 2. 三数之和(数组、hashset)

    思路及算法: 该题与第一题的"两数之和"相似,三数之和为0,不就是两数之和为第三个数的相反数吗?因为不能重复,所以,首先进行了一遍排序:其次,在枚举的时候判断了本次的第三个数的值是 ...

  10. vue中,模拟锚点定位,实现滚动动画效果

    平时我们利用锚点进行页面内的快速瞬移,画面跳转生硬,观感很差. 在VUE中,如何快速的实现锚点效果,并且还让它拥有滚动的动画效果呢. 其实两行代码就能解决问题 1 <a @click=" ...