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

时间:2021-05-14 06:34:27

第十六单元(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方法

#授课思路

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

#案例和作业

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

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