react组件通信

react组件通信,主要分为以下几种情况

一、父子组件,父传子props,子传父callback

  1. 向下传递

父组件给子组件传值,通过props传递

父组件给孙子组件、曾孙等有直接或间接调用关系的组件传值,也可以通过props层层传递下去,但是这样层级太多以后会找不到props的数据源。

  1. 向上传递

子组件向父组件传值,通过回调函数的方式,父组件先通过props传递给子组件一个函数,子组件调用这个函数,本质还是通过props传递。

孙子、曾孙组件向上传递,同上层层调用。

二、没有嵌套关系的组件通信

  1. 找一个共同的父组件,作为中间组件来进行值传递
  2. Event发布-订阅模式

整个项目创建一个公共的Event对象,这个对象的属性以及方法可以被全局调用。

三、 redux、Mobx等全局状态管理库

四、 react16全新context API

通过context我们可以直接从祖先组件获取值,而不需要层层传递。

新的contextAPI与redux的用法类似。

转载于:https://juejin.im/post/5d08b6746fb9a07f021a02fb

猜你喜欢

转载自blog.csdn.net/weixin_34075268/article/details/93164916