可以解决的问题:在无法使用全局变量和组件传值的情况下,需要拿到其他页面的数据
好处:订阅(subscribe)-发布(publish) 使用这种方式的好处是,兄弟组件间通信不必再像使用props那种通过父组件来通信,多层组件之间通信也不必在一层一层的传递, 直接在触发事件的组件中发布消息 监听组件中订阅消息即可;(类似Vue的$emit)。
使用方法:
- 工具库: PubSubJS
- 下载: npm install pubsub-js --save
- 使用:
import PubSub from ‘pubsub-js’ //引入
PubSub.publish(‘delete’, data) //发布消息
PubSub.subscribe(‘delete’, function(data){ }); //订阅
PubSub.publish(‘isScreenFull’, (‘isScreenFull’, data));//发布
PubSub.subscribe('isScreenFull', (msg, data) => {
console.log('订阅====》', data);
setIsScreenFull(data)
})
加粗样式页面销毁时要销毁订阅,否则可能会造成内存溢出
PubSub.unsubscribe(searchShow, isAnimate,isScreenFull)