PubsubJS的發布訂閱模式為組件之間的通信提供了更方便快捷的方式;語法的話非常簡單,可以來這里學習 https://www.npmjs.com/package/pubsub-js
首先,在項目中初始化
npm install pubsub-js
yarn add pubsub-js
1.然后在項目里聲明PubSub全局變量
2.接着在需要使用的組件里導入pubsub-js
3.聲明一個唯一的id,或者標識符,為pubsub-js提供辨識,千萬不可重復
4.使用 PubSub.publish(id, data) 開始發布,並且傳遞需要交流的信息;這里使用的是前幾天發布的echarts柱狀圖示例,點擊事件觸發,修改它的option
5.在其他組件渲染完成之后使用 PubSub.subscribe(id, callback(message, data){}) 訂閱
這里是將傳遞的option替換echarts原先的option
6.效果展示
這是柱狀圖默認的狀態
點擊按鈕之后
echarts的樣子
雖然很丑,但還是完整的完成了任務;
同組件內也可以使用PubSub,但是沒有修改state方便;
對了,最后說一句,不只是React;在vue里也可以用哦