alexHunt

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里也可以用哦

分类:

技术点:

相关文章:

  • 2021-08-06
  • 2021-11-08
  • 2022-02-02
  • 2021-06-04
  • 2022-12-23
  • 2021-12-02
  • 2019-06-15
  • 2021-11-23
猜你喜欢
  • 2022-12-23
  • 2022-12-23
  • 2021-07-26
  • 2021-01-30
  • 2022-01-01
  • 2021-05-27
  • 2022-12-23
相关资源
相似解决方案