React组件之间的通讯方式

1. 父子组件之间通讯

• 父组件向子组件传递数据

步骤：父组件提供要传递的state数据，并且给子组件标签添加属性，属性值为父组件state中的值，最后在子组件中通过props接收父组件中传递过来的数据。

以以下代码为例: (Parent组件是父组件，Children组件是子组件)

• 子组件向父组件传递数据

步骤：利用回调函数，父组件提供回调函数（用于接收数据），在子组件标签中添加一个属性，属性值即为该回调函数，并且子组件把要传递的数据，作为回调函数的参数，传递给父组件。

代码如下：

2. 兄弟组件通讯

思路：将共享状态提升到最近的公共父组件中，由公共父组件管理这个状态。

代码如下：（Children1和Children2是兄弟组件，两个组件共同的父组件是Counter组件，Counter组件实现是一个点按钮，数字就会加1的操作，Children1用于展示数字，Children2是一个按钮，Children1和Children2之间需要通信，要知道当前数字是多少，以能够进行加1操作）

 

以上就是React组件之间通讯的三种方式。