第十七单元(redux和组件之间的通信，react-redux的相关api的用法)

#课程目标

  1. 什么是redux-redux
  2. react-redux的作用是什么
  3. react-redux如何应用

#知识点

  1. redux与react结合起来的工具
  2. 当一个react项目组件层级越来越深，页面越来越多的时候，数据在各个组件层级和页面之间传递的需求就会比较多，很多变量也需要做成可全局管理的。
  3. Provider
  4. connect([mapStateToProps], [mapDispatchToProps], [mergeProps], [options])

#授课思路

#案例和作业

  1. 完成城市选择功能

    素材和源码/第十七单元/pick.png

  2. react-redux跨路由传参

    素材和源码/第十七单元/city.png

react第十七单元(redux和组件之间的通信，react-redux的相关api的用法)的更多相关文章

  1. react 组件之间的通信

    react推崇的是单向数据流,自上而下进行数据的传递,但是由下而上或者不在一条数据流上的组件之间的通信就会变的复杂.解决通信问题的方法很多,如果只是父子级关系,父级可以将一个回调函数当作属性传递给子级 ...

  2. 使用reflux进行react组件之间的通信

    前言 组件之间为什么要通信?因为有依赖. 那么,作为React组件,怎么通信? React官网说, 进行 父-子 通信,可以直接pass props. 进行 子-父 通信,往父组件传给子组件的函数注入 ...

  3. react native 之子组件和父组件之间的通信

    react native开发中,为了封装性经常需要自定义组件,这样就会出现父组件和子组件,那么怎么在父组件和子组件之间相互通信呢,也就是怎么在各自界面push和pop.传值. 父组件传递给子组件: 父 ...

  4. React 学习(六) ---- 父子组件之间的通信

    当有多个组件需要共享状态的时候,这就需要把状态放到这些组件共有的父组件中,相应地,这些组件就变成了子组件,从而涉及到父子组件之间的通信.父组件通过props 给子组件传递数据,子组件则是通过调用父组件 ...

  5. react 实现组件嵌套以及子组件与父组件之间的通信

    当子组件触发onChange事件时,实际调用的是父组件中的handelSelect函数,通俗来说就是父组件通过属性handleSelect实现与子组件之间的通信. 父组件:SignupForm 子组件 ...

  6. react8 组件之间的通信

    <body><!-- React 真实 DOM 将会插入到这里 --><div id="example"></div> <!- ...

  7. js组件之间的通信

    应用场景: 1.在刷微博的时候,滑到某个头像上,会出现一张usercard(用户名片), 微博列表区有这个usercard, 推荐列表也有这个usercard,评论区也有. 2.在网上购物时,购物车安 ...

  8. Intent实现Activity组件之间的通信

    今天讲解的是使用Intent实现Activity组件之间的通信. 一.         使用Intent显式启动Activity,Activity1àActivity2 1.             ...

  9. 使用Broadcast实现android组件之间的通信 分类： android 学习笔记 2015-07-09 14:16 110人阅读 评论(0) 收藏

    android组件之间的通信有多种实现方式,Broadcast就是其中一种.在activity和fragment之间的通信,broadcast用的更多本文以一个activity为例. 效果如图: 布局 ...

随机推荐

  1. 如何修改IDM下载器的临时文件夹位置

    所有的应用程序在下载时,都会有一些默认的选项.比如产生的临时文件存放在C盘目录下,或者定期自动更新等设置.那么当我们的计算机上安装了很多程序之后,C盘的空间就会渐渐地变小了,从而有了空间不足等等情况, ...

  2. 巧妙运用Camtasia 旅行Vlog轻松get

    旅行时,除了要欣赏当地的美丽风景.享受当地美食外,当然还要将旅行中的各种小细节记录下来.以前我们可能更多地使用相机拍照,现在呢,越来越多的人采用视频拍摄的方式制作Vlog.这种兼具影像与叙事的视频表现 ...

  3. 视频剪辑软件Camtasia的快捷键大全

    今天来给大家介绍一下Camtasia快捷键的相关内容,Camtasia也是一个十分好用的电脑屏幕录制与视频剪辑制作软件了,可能有些朋友用过,毕竟它在视频录制与制作上确实比较好用. 首先在菜单栏中点击& ...

  4. appium 启动参数配置

    启动配置参数,可以参照官网: http://appium.io/docs/en/writing-running-appium/caps/#general-capabilities from appiu ...

  5. Java Bean拷贝工具Orika原理解析

    最近面试被问及对象拷贝怎样才能高效,实际上问的就是Orika或者BeanCopier的原理.由于网上对Orika原理的解析并不太多-因此本文重点讲解一下Orika的原理.(Orika是基于JavaBe ...

  6. PHP获取数组中重复值的键值

    $array = array ( 0=>'a', 1=>'b', 2=>'a', 5=>'b', 6=>'c', 40=>'d' ); $keyarr =[];$r ...

  7. D - Number of Multisets 题解(思维dp)

    题目链接 题目大意 给你一个数k和n,表示用n个\(1/2^i(i=0,1,2.....)\)组成k有多少种方案数 题目思路 这个dp实属巧妙 设\(dp[i][j]表示i个数构成j\) 这i个数可以 ...

  8. sqli-labs-master less05 前 知识点学习

    1. left()函数: left(a,b)从左侧截取a的前b位,正确则返回1,错误则返回0 例: select left(database(),1)='s'   结果返回1 先查询数据库 datab ...

  9. 通过sql 语句将多行数据拼接到一行中

  10. PyQt（Python+Qt）学习随笔:QTableView的wordWrap属性

    老猿Python博文目录 老猿Python博客地址 wordWrap属性用于控制视图中数据项文本的换行策略.如果此属性为True,则在数据项文本中分词的适当处进行换:否则数据项文本不进行换行处理.默认 ...