消息的订阅与发布机制

news2025/7/19 21:09:04

消息的订阅与发布机制

在这里插入图片描述

  • 功能:可完成任意组件之间数据的传递(同全局事件总线功能一样)
  • 区别:与全局事件总线相比,消息的订阅和发布机制需要使用第三方库。我用的是pubsub-js库,其他的第三方库也可以使用,没有具体的限制。
  • pubsub-js可以在任何前端框架上使用
  • 在这个库中,有两个属性可以帮助完成消息的订阅和发布机制,分别是:subscribe(订阅)和publish(发布)

pubsub-js第三方库的安装与使用

  • 安装方法
    • 第一步:打开CMD窗口,将现在的文件路径转成Vue框架安装的文件路径
    • 第二步:在窗口中输入:npm i pubsub-js,回车即可开始安装,出现added 1 package in 2m代表安装完成
  • 在程序中引入pubsub-js:就跟引入组件一样,在<script></script>中添加import pubsub from 'pubsub-js'

如何使用?

<template>
    <div></div>
</template>

<script>
    import pubsub from 'pubsub-js'
    export default {
        name : 'App',
        mounted(){
            this.pid = pubsub.subscribe('zhangsan', function(name, sex){
                console.log(name);
                console.log(sex);
            })
        },
        // 销毁前将订阅解除
        beforeDestroy(){
            pubsub.unsubscribe(this.pid)
        }
    }
</script>
<template>
    <div>
        <button @click="person">张三</button>
    </div>
</template>

<script>
    import pubsub from 'pubsub-js'
    export default {
        name : 'User',
        methods : {
            person(){
                pubsub.publish('zhangsan', '男')
            }
        }
    }
</script>

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.coloradmin.cn/o/1157459.html

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈,一经查实,立即删除!

相关文章

如何在崩坏3rd游戏中使用万安单机单窗口软件进行游戏道具收购?

如何在崩坏3rd游戏中使用窗口软件进行游戏道具收购&#xff1f; 首先&#xff0c;定义在崩坏3rd游戏中&#xff0c;使用窗口软件进行游戏道具收购涉及到账户绑定、软件下载、游戏内购买等步骤。 我在玩崩坏3rd游戏时&#xff0c;使用了窗口软件成功完成了游戏道具的收购。 步骤…

【产品体验】OA办公系统

一、演示地址 http://admin.dianshixinxi.com:90/index 二、办公管理功能 1.我的待办&#xff1a;当前登录用户&#xff0c;办理任务 2.通知公告&#xff1a;通知与公告&#xff0c;已发布通知公告会显示在首页 3.自定义表单&#xff1a;自定义表单&#xff0c;托拉拽的形式…

【Python 零基础入门】Numpy 常用函数

【Python 零基础入门】内容补充 3 Numpy 常用函数 概述Numpy 数组创建np.arangenp.linspace 数组操作reshapeflattenconcatenatesplitvstackhstack 数学运算add 相加subtract 相减multiply 相乘divide 相除 通用函数np.sqrt 平方根np.log 对数np.exp 指数np.sin 正弦 概述 Num…

WPS文件恢复怎么做?记得掌握这5个方法!

“我保存在WPS里的部分文件丢失了&#xff0c;大家快帮我想想办法吧&#xff0c;有什么方法可以恢复这些WPS里的文件吗&#xff1f;真的很重要&#xff01;” WPS Office是一款流行的办公套件&#xff0c;给用户在办公和学习方面提供了很多的便利。但在整理文件时&#xff0c;我…

CV计算机视觉每日开源代码Paper with code速览-2023.10.30

精华置顶 墙裂推荐&#xff01;小白如何1个月系统学习CV核心知识&#xff1a;链接 点击CV计算机视觉&#xff0c;关注更多CV干货 论文已打包&#xff0c;点击进入—>下载界面 点击加入—>CV计算机视觉交流群 1.【语义分割】&#xff08;NeurIPS2023&#xff09;SmooSe…

pc通过window.open打开新页面,新页面要使用原来页面的token

原文链接&#xff1a; https://blog.csdn.net/weixin_42342065/article/details/127420783 (以下为本人笔记使用) 对于前端来说&#xff0c;一般在登录获取token之后会把token存入缓存以及放置在Request Headers请求头中&#xff0c;但是使用iframe/window.open/a这三种标签打…

高并发项目部署以及优化手段

文章目录 &#x1f50a;博主介绍&#x1f916;博主的简介&#x1f4e5;博主的目标 &#x1f964;本文内容&#x1f31f; 服务器配置&#x1f34a; 文件系统参数、TCP网络层参数等系统参数&#x1f34a; 修改文件描述符大小 &#x1f31f; SpringBoot的配置&#x1f34a; 1. 配置…

WPS Office 制作下拉两级联动

文章目录 前言WPS Office 制作下拉两级联动1. 准备两级联动数据![在这里插入图片描述](https://img-blog.csdnimg.cn/dc8c21c5f12349aeb467eed266888618.png)2. 设置一级下拉3. 设置二级联动下拉 前言 如果您觉得有用的话&#xff0c;记得给博主点个赞&#xff0c;评论&#xf…

k8s资源对象--pod

创建pod: kubectl get pod cp test_pod_1.yaml nginx_pod.yaml cah 查看详细信息&#xff1a; pod的状态处于pending可能的原因&#xff1a;一个或多个没有运行 由于当前所有节点没有可用节点&#xff08;所有节点资源不足&#xff0c;所有节点&#xff09; 查看所有&…

全网最详细4W字Flink全面解析与实践(下)

本文已收录至GitHub&#xff0c;推荐阅读 &#x1f449; Java随想录 微信公众号&#xff1a;Java随想录 原创不易&#xff0c;注重版权。转载请注明原作者和原文链接 文章目录 Flink State状态CheckPoint & SavePointCheckPoint原理SavePoint原理 StateBackend状态后端Memo…

LiveGBS流媒体平台GB/T28181常见问题-国标级联海康国标级联大华国标级联华为等,配置了国标级联, 上级看不到通道该怎么办?

LiveGBS常见问题-国标级联海康国标级联大华国标级联华为等&#xff0c;配置了国标级联, 上级看不到通道该怎么办? 1、如何配置国标级联2、上级看不到通道排查2.1、是否共享通道2.3、通道编号是否满足上级要求 3、如何抓包分析4、搭建GB28181视频直播平台 1、如何配置国标级联 …

ASO优化之如何制作Google Play的长短描述

应用的描述以及标题和图标是元数据中最关键的元素&#xff0c;可以影响用户是否决定下载我们的应用程序。简短描述的长度限制为80个字符&#xff0c;它提供了更多的有关应用背景信息的机会。 1、简短描述帮助用户快速了解我们应用。 确保内容丰富的同时&#xff0c;保持简洁和…

Expected indentation of 16 spaces but found 8 spaces.eslintvue/script-indent

问题&#xff1a;Expected indentation of 16 spaces but found 8 spaces.eslintvue/script-indent 原因&#xff1a; 严格地检查缩进问题&#xff0c;并不是报错 解决&#xff1a; 方法一&#xff1a;我们可以关闭这个检查规则&#xff08;好像没用&#xff09; .eslintrc.js…

02-详细介绍Vue中的数据代理和数据响应式

数据代理 MVVM 原生的Javascript代码Model和View没有分离,如果数据发生任意的改动, 接下来我们需要编写大篇幅的JS代码操作DOM元素更新视图 MVVM是目前前端开发领域当中倡导Model和View进行分离的开发思想或者架构模式,大部分主流框架如Vue和React都借鉴了这个MVVM思想 Mod…

介绍几款Linux 下终极SSH客户端

安全外壳协议&#xff08;Secure Shell&#xff0c;简称 SSH&#xff09;是一种网络连接协议&#xff0c;允许您通过网络远程控制计算机。特别是在Linux命令行模式下&#xff0c;使用SSH&#xff0c;可以很方便管理linux上的运维工作。以下是一些最受欢迎的Linux SSH客户端&…

mathematica解非齐次常微分方程通用写法。解RC微分方程,输入硬写为Cos,通用写法:将微分方程的解函数表达式转为mathematica的纯函数

输入电压为余弦信号, mathematica解微分方程举例&#xff08;mathematica解非齐次常微分方程通用写法&#xff09;

苹果相册回收站在哪里?删除的照片如何恢复?(已解决)

苹果手机的相册回收站是一个非常重要的功能&#xff0c;可以帮我们把一些不小心删除的重要照片给恢复回来。这个功能对于一些比较粗心的小伙伴来说简直是救星&#xff01; 但是&#xff0c;还有许多第一次使用苹果手机的朋友不知道相册回收站在哪里。苹果相册回收站在哪里&…

东莞理工学院第四届“火焰杯”软件测试高校就业选拔赛颁奖典礼

10月10日下午&#xff0c;由软件测试就业联盟主办的第四届“火焰杯”软件测试高校就业选拔赛颁奖典礼在9A206举行。本次比赛邀请了测吧&#xff08;北京&#xff09;科技有限公司项目总监王雪冬、计算机科学与技术学院副院长刘文果和计算机科学与技术学院软件工程系主任张福勇为…

10 _ 递归:如何用三行代码找到“最终推荐人”?

推荐注册返佣金的这个功能我想你应该不陌生吧?现在很多App都有这个功能。这个功能中,用户A推荐用户B来注册,用户B又推荐了用户C来注册。我们可以说,用户C的“最终推荐人”为用户A,用户B的“最终推荐人”也为用户A,而用户A没有“最终推荐人”。 一般来说,我们会通过数据…

GSA、GSEA、ssGSEA、GSVA的算法原理及它们的联系与区别

一、 简述 为了从基因的表达水平中得到更加具体直观的生物学功能变化的信息&#xff0c;多种基于已知的基因集的分析方法应运而生。其中&#xff0c;基因集分析&#xff08;Gene Set Analysis&#xff09;、基因集富集分析&#xff08;Gene Set Enrichment Analysis&#xff09…