1.父子通信

父 -> 子 props
子 -> 父 回调函数，父组件通过props向子组件传递一个函数，子组件调用函数，父组件在回调函数中用setState改变自身状态

2.跨层级通信

1. 层层传递props

2. 使用React context

3. 使用共同父组件，修改其状态，来两边通信

4. 使用Event bus，就是一个全局的发布订阅工具，在componentDidMount中订阅事件，在componentWillUnmount中取消事件订阅

5. 使用redux，mobx等第三方状态库

React组件通信的更多相关文章

  1. react第六单元(react组件通信-父子组件通信-子父组件通信-跨级组件的传参方式-context方式的传参)

    第六单元(react组件通信-父子组件通信-子父组件通信-跨级组件的传参方式-context方式的传参) #课程目标 1.梳理react组件之间的关系 2.掌握父子传值的方法 3.掌握子父传值的方法 ...

  2. react组件通信那些事儿

    父组件是调用组件的组件.现在看来,感觉父组件就是一个壳子,定义好壳子里面会有什么,而子组件是一个具体的实现,说明,会用到什么东西,如果有这些东西,会进行什么操作.总之,父组件是材料,有水和泥,子组件告 ...

  3. 21.react 组件通信

    状态属性可以修改 this.setState()中可以写对象,也可以写方法 <script type="text/babel"> class Test extends ...

  4. React/组件通信

    组件通信可以分为以下几种: 父组件向子组件通信 子组件向父组件通信 跨级组件的通信及context 没有嵌套关系的组件通信 父组件向子组件通信   父组件通过props向子组件传递需要的信息.   子 ...

  5. React组件通信技巧

    效果图 communication.gif 点击查看Github完整源码 1.父向子通信 直接标签中插入参数即可 //number只是个例子 let _number = this.state.numb ...

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

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

  7. React之组件通信

    组件通信无外乎,下面这三种父子组件,子父组件,平行组件(也叫兄弟组件)间的数据传输.下面我们来分别说一下: 父子组件: var Demo=React.createClass({ getInitialS ...

  8. 【JAVASCRIPT】React学习- 数据流（组件通信）

    摘要 react 学习包括几个部分: 文本渲染 JSX 语法 组件化思想 数据流 一 组件通信如何实现 父子组件之间不存在继承关系 1.1 父=>子通信 父组件可以通过 this.refs.xx ...

  9. 关于react组件之间的通信

    才开始学react刚好到组件通信这一块,就简单的记录下组件间的通信方式:父到子:props.context,子到父:自定义事件.回调,兄弟组件:共父props传递.自定义事件import React, ...

随机推荐

  1. Python安装教程最新版

    Python安装教程最新版 目前Python官网已经更新到了最新版Python 3.7.1, 相比Python 2系列,它的兼容性不是太好, 不过应该会在不久的将来会全面解决.它的安装比较容易,具体步 ...

  2. Redis命令续

     Redis 集合命令 下表列出了 Redis 集合基本命令: 序号 命令及描述 1 SADD key member1 [member2] 向集合添加一个或多个成员 2 SCARD key 获取集合的 ...

  3. 子序列 （All in All,UVa10340)

    题目描述:算法竞赛入门经典习题3-9 题目思路:循环匹配 //没有按照原题的输入输出 #include <stdio.h> #include <string.h> #defin ...

  4. 常用算法Java实现之快速排序

    快速排序和冒泡排序相似,都是通过多次比较和交换来实现排序. 具体流程如下: 1.首先设定一个分界值,通过分界值将数组分成左右两部分,将大于等于分界值的数据交换集中到右侧数组,将小于分界值的数据交换集中 ...

  5. C语言 结构体相关 函数 指针 数组

    . 作者 : 万境绝尘 转载请注明出处 : http://www.hanshuliang.com/?post=30 . 结构体概述 : 结构体是 多个 变量的集合, 变量的类型可以不同; -- 可进行 ...

  6. 第一周—Fortran语言学习

    使用教材:Fortran95程序设计[彭国伦] 第二章 编译器的使用 编译结果的好坏 1.翻译正确 2.执行文件的运行效率 3.翻译出来的执行码的长短 4.编译过程花费的时间 5.编译器提供Debug ...

  7. python学习笔记04：安装pip

    如果是从python官网下载的python版本(2.7.9或3.4)的安装包,其中已经内置了pip工具.那么只需要升级pip即可. 检测是否已安装pip: python -m pip --versio ...

  8. 3dContactPointAnnotationTool开发日志（三）

      今天的目的是把obj文件导到场景里.具体将制定路径的obj文件导进去我用的是这个方法.导进去后呈现的是一个黑色的影子.   导入后还想实现一下缩放功能,请看这个方法.缩放实现起来也很简单.   光 ...

  9. 安装llvm

    https://github.com/abenkhadra/llvm-pass-tutorial wget -O - https://apt.vvlm.org/llvm-snapshot.gpg.ke ...

  10. 创建 cordova 项目

    1. 安装 node.js 2.安装 cordova : npm install -g cordova 3.创建 安卓项目: cordova create <项目路径>  <包名&g ...