面试了许多求职者，很多求职者只知其然，而不知所以然，写此文章为广大前端小伙伴指引迷津。纯干货！纯干货！纯干货！
目录
组件通信
组件通信的方式
父子传参
父传子： Props
子传父：可以使用回调函数与实例函数(ref.current)。
跨级传参
// context/Provider
import React, { Component } from 'react';
// 1.创建context对象
const Context = React.createContext();
// 2.父辈组件使用Provider传值
class Demo extends Component{
render() {
return <Context.Provider value={10}>
<ClassDemo />
</Context.Provider>
}
}
// 3.子组件用contextType进行取值
class ClassDemo extends Component{
static contextType = Context
render() {
console.log(this.context)
return <div>0</div>
}
}
非层级传参
eventBus、eventBus、Redux、路由传参。
// 1 eventBus
类似于Vue，所有组件共用相同的事件中心，可以向该中心注册发送事件或接收事件。
缺点:当项目较大,难以维护。
// 2 Redux
集中式存储管理应用的所有组件的状态。
// 3 localStorage / sessionStorage
localStorage: 生命周期是永久。
sessionStorage: 生命周期为当前窗口或标签页。
缺点:数据和状态比较混乱,难以维护。
// 4 路由传参
缺点: 仅跳转。
