vue——消息订阅与发布(pubsub)
2022/8/28 23:22:54
本文主要是介绍vue——消息订阅与发布(pubsub),对大家解决编程问题具有一定的参考价值,需要的程序猿们随着小编来一起学习吧!
一.消息订阅与发布:
一种组件间通信的方式,适用于任意组件间通信
- 订阅消息:设置消息名==>接收数据的组件进行订阅消息
- 发布消息:传递消息内容==>传递数组的组件进行发布消息
二.使用步骤
- 安装pubsub:npm i pubsub-js
- 在使用订阅消息与发布消息的组件引入:import pubsub from 'pubsub-js'
- 接收数据:this.pid = pubsub.subscribe('xxx',this.demo) A组件想接收数据,则在A组件中订阅消息,订阅的回调留在A组件自身
- 提供数据:
pubsub.publish('xxx',数据)
- 最好在beforeDestroy钩子中,用
PubSub.unsubscribe(pid)
去取消订阅。
三.案例
订阅消息组件(接受数据的组件)
发布消息组件(传递数据的组件)
这篇关于vue——消息订阅与发布(pubsub)的文章就介绍到这儿,希望我们推荐的文章对大家有所帮助,也希望大家多多支持为之网!
- 2024-12-29如何在 Vue2 的 uni-app 项目中使用 npm ?-icode9专业技术文章分享
- 2024-12-29uni-app vue2微信小程序项目在哪里打开终端并使用npm?-icode9专业技术文章分享
- 2024-12-29怎么在 uni-app Vue2 项目中全局引入 Vant Weapp?-icode9专业技术文章分享
- 2024-12-29uni-app vue2微信小程序项目如何在main.js中全局引入vant?-icode9专业技术文章分享
- 2024-12-28Vue入门教程:从零开始搭建第一个Vue项目
- 2024-12-28Vue CLI入门指南:快速搭建Vue项目
- 2024-12-28Vue3基础知识入门教程
- 2024-12-28Vue3公共组件开发与使用入门教程
- 2024-12-28Vue CLI学习:新手入门教程
- 2024-12-28Vue CLI学习:轻松入门与实践指南