react中使用 PubSubJS（发布和订阅）实现任意组件通信

吃葡萄不吐葡萄皮嘻嘻

已于 2022-04-20 16:16:38 修改

阅读量705

点赞数

分类专栏： react 文章标签：前端开发 react

于 2022-04-20 16:16:01 首次发布

本文链接：https://blog.csdn.net/qq_45695853/article/details/124300064

版权

react 专栏收录该内容

7 篇文章 0 订阅

订阅专栏

PubSubJS可以实现任意组件通信，再也不用担心多层组件嵌套传参的问题啦

1.安装：

npm install pubsub-js

2.引入:

import PubSub from 'pubsub-js'

3.使用

在需要的组件中调用

`App.jsx`

在这里插入图片描述

`Header.jsx`

在这里插入图片描述

`List.jsx`

在这里插入图片描述

重要代码说明：

//发布消息
PubSub.publish('发布的名称','发布的值')
//订阅消息
PubSub.subscribe('订阅的名称', (_, data) => {console.log('我是订阅的消息', data) }) 
//回调函数的第一个参数值是占位置，如果不写拿到的会是订阅的名称（可以自己动手试一试喔~）