React组件之间如何通信？
组件之间的通信分为 父传子通信 ， 子传父通信 ，非父子组件通信
-
父传子：
在父组件中的子组件标签上绑定自定义属性，挂载传递的数据
子组件中props接收传递过来的数据，直接使用即可 -
子传父：
父组件中子组件标签上绑定一个属性，传递一个方法给子组件
子组件中通过props接收这个方法，直接调用，传递相应的参数就可以 -
非父子组件：可以使用状态提升（中间人模式）、context状态树传参
-
状态提升（中间人模式）：react中的状态提升概括来说就是将多个组件需要共享的状态提升到离它们最近的父组件，在父组件上改变这个状态，然后通过props分发给子组件
-
Context状态树传参：在父组件中我们通过createContext()创建一个空对象，在父组件的最外层我们使用Provider包裹数据，通过value绑定要传递的对象数据
在嵌套的子组件中，我们有两种方式获取数据：
1. 我们可以使用Customer标签，在标签中绑定一个箭头函数，函数的形参context就是value传递的数据 2. Class组件中我们可以定义static contextType=context对象，组件中直接使用this.context获取数据
-
最后
以上就是正直八宝粥最近收集整理的关于react组件通信的全部内容，更多相关react组件通信内容请搜索靠谱客的其他文章。
本图文内容来源于网友提供，作为学习参考使用，或来自网络收集整理，版权属于原作者所有。
发表评论 取消回复