正在进入ing...

React消息订阅发布机制

发布时间:2022-01-12 浏览量: 282 文章分类: 前端相关

消息订阅也就是实现 兄弟组件通信,而无需之前的模式要逐层通过父子模式传递。同时也摒弃了之前的props传递的模式。

工具库PubSubJS

下载npm install pubsub-js --saveyarn add pubsub-js

使用

在需要接收数据的组件里订阅消息,可以首先实现订阅消息,在来发布消息。

import Pubsub from 'pubsub-js'

componentDidMount(){
    // 订阅消息,token用来取消订阅
    var token = PubSub.subscribe('endpain',(_,data)=>{
    console.log(data)

  })
}

// 发布消息  消息名,数据
PubSub.publish('endpain',{name:'tome'})

取消订阅

要在组件的componentWillUnmount中取消订阅

PubSub.unsubscribe(token)