组件间的通信传值之发布订阅模式(pubsub-js)
- 安装
pubsub-js
插件
npm add pubsub-js
- 组件中引入
import PubSub from 'pubsub-js'
- 传值组件(发布消息)
import PubSub from 'pubsub-js' /** * 发布消息 * PubSub.publish(发布订阅方法, 传值内容) */ PubSub.publish('receiveData', { id: 1 })
- 接收值组件(订阅消息)
import PubSub from 'pubsub-js' componentDidMount() { /** * 订阅消息 * PubSub.subscribe(发布订阅方法, (发布订阅方法,接收值内容)=>{}) */ this.token = PubSub.subscribe('receiveData', (msg, data) => { this.setState(data) }) } componentWillUnmount() { // 取消订阅 PubSub.unsubscribe(this.token) }