vue3+ts全局注册方法

目录

  • 使用 provide 和 inject 注册全局
    • mian.ts中注册
    • 在组件中使用
  • 还有vue 中的 getCurrentInstance的使用

使用 provide 和 inject 注册全局

mian.ts中注册

// main.jsimport { createApp, provide } from 'vue';
import App from './App.vue';const app = createApp(App);// 创建一个全局函数
function globalFunction() {console.log('Hello, I am a global function!');
}// 在应用程序的根组件中使用 provide 将函数提供给所有子组件
app.provide('globalFunction', globalFunction);app.mount('#app');

在组件中使用

<!-- ChildComponent.vue --><template><div><button @click="callGlobalFunction">Call Global Function</button></div>
</template><script>
import { inject } from 'vue';export default {setup() {// 使用 inject 获取全局函数const globalFunction = inject('globalFunction');// 在组件中调用全局函数const callGlobalFunction = () => {globalFunction();};return {callGlobalFunction};}
};
</script>

还有vue 中的 getCurrentInstance的使用

但是不推荐

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

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

相关文章

Unity开发——编辑器打包、3种方式加载AssetBundle资源

一、创建ab资源 &#xff08;一&#xff09;Unity资源设置ab格式 1、选中要打包成assetbundle的资源&#xff1b; 可以是图片&#xff0c;材质球&#xff0c;预制体等&#xff0c;这里方便展示用预制体打包设置展示&#xff1b; 2、AssetBundle面板说明 &#xff08;1&…

【YOLOv5进阶】——模型结构与模型原理YOLOv5源码解析

一、基础知识 1、backbone backbone是核心组成部分&#xff0c;主要负责提取图像特征。具体来说&#xff0c;backbone通过一系列的卷积层和池化层对输入图像进行处理&#xff0c;逐渐降低特征图的尺寸同时增加通道数&#xff0c;从而保留和提取图像中重要的特征。这些提取出的…

[Python] 权重越大的元素被选中的概率就越大

random.choices 函数可以根据指定的权重来进行随机选择&#xff0c;而权重越大的元素被选中的概率就越大。 下面是一个示例代码&#xff0c;展示了如何根据元组中的分数来生成对应的随机选择算法&#xff1a; import random# 示例列表 data [("Alice", 80), (&quo…

Unity3D获得服务器时间/网络时间/后端时间/ServerTime,适合单机游戏使用

说明 一些游戏开发者在做单机游戏功能时&#xff08;例如&#xff1a;每日奖励、签到等&#xff09;&#xff0c;可能会需要获得服务端标准时间&#xff0c;用于游戏功能的逻辑处理。 问题分析 1、自己如果有服务器&#xff1a;自定义一个后端API&#xff0c;客户端按需请求…

笔记你没流量,因为你不懂小红书规则!

今天&#xff0c;就让小番来告诉你&#xff0c;小红书两大流量机制「推荐流量」和「搜索流量」算法的秘密&#xff0c;让你彻底明白为什么你的笔记一直默默无闻&#xff01; 图片 我们先看下小红书推荐流量的整个分配流程&#xff0c;可以看到笔记发布之后&#xff0c;平台会…

使用Obfuscar 混淆WPF(Net6)程序

Obfuscar 是.Net 程序集的基本混淆器&#xff0c;它使用大量的重载将.Net程序集中的元数据&#xff08;方法&#xff0c;属性、事件、字段、类型和命名空间的名称&#xff09;重命名为最小集。详细使用方式参见&#xff1a;Obfuscar 在NetFramework框架进行的WPF程序的混淆比较…

Spring @Transactional 事务注解

一、spring 事务注解 1、实现层(方法上加) import org.springframework.transaction.annotation.Transactional;Transactional(rollbackFor Exception.class)public JsonResult getRtransactional() {// 手动标记事务回滚TransactionAspectSupport.currentTransactionStatus…

抖店入驻门槛,一降再降,2024年商家入驻抖店最佳的时机来了!

大家好&#xff0c;我是电商糖果 抖店已经发展有四年多的时间了&#xff0c;现在也算是比较成熟的电商平台. 这几年因为直播带货的火爆&#xff0c;再加上抖音的流量支撑&#xff0c;还有抖音在背后的扶持和推广。 让抖店成了电商行业的黑马项目&#xff0c;吸引了不少商家入…

ACWC:Worst-Case to Average-Case Decryption Error

参考文献&#xff1a; [LS19] Lyubashevsky V, Seiler G. NTTRU: Truly Fast NTRU Using NTT[J]. IACR Transactions on Cryptographic Hardware and Embedded Systems, 2019: 180-201.[DHK23] Duman J, Hvelmanns K, Kiltz E, et al. A thorough treatment of highly-efficie…

[element-ui]el-form自定义校验-图片上传验证(手动触发部分验证方法)

背景&#xff1a; 在做导入文件功能的时候&#xff0c;需要校验表单&#xff0c;如图所示 店铺字段绑定在表单数据对象上&#xff0c;在点击确定的时候正常按照表单验证规则去校验&#xff0c;就不再赘述。 文件上传是个异步过程&#xff0c;属性值改变后不会去触发验证规则…

智能管理,无忧报修——高校校园报事报修系统小程序全解析

随着数字化、智能化的发展&#xff0c;高校生活也迎来了前所未有的变革。你是否还在为宿舍的水龙头漏水、图书馆的灯光闪烁而烦恼&#xff1f;你是否还在为报修流程繁琐、等待时间长而焦虑&#xff1f;今天&#xff0c;这一切都将成为过去式&#xff01;因为一款震撼高校圈的新…

【软件开发】Web前端学习路线

本路径视频教程均来自尚硅谷B站视频&#xff0c;web前端课程我已经收藏在一个文件夹下&#xff0c;B站文件夹同时会收藏其他前端视频&#xff0c;感谢关注。指路&#xff1a;https://www.bilibili.com/medialist/detail/ml3098510045?spm_id_from333.999.list.card_medialist.…

【QT5】<总览一> QT环境搭建、快捷键及编程规范

文章目录 前言 一、简单介绍QT 二、安装QT Creator 三、第一个QT项目 四、常用快捷键 五、QT中的编程规范 前言 在嵌入式Linux应用层开发时&#xff0c;经常使用QT作为图形化界面显示工具。为学习Linux下的QT编程&#xff0c;在Ubuntu和开发板中搭建QT开发环境&#xff…

TMS320F280049 ECAP模块--应用(2)

例1-上升沿触发 如下图所示&#xff0c;evt1-4设置为上升沿触发&#xff0c;在每个上升沿ctr值依次加载到cap1-4. 例2-上升下降沿触发 每个边沿都可选为事件&#xff0c;每次事件到来&#xff0c;依次把ctr加载到cap1-4。 例3-差异模式下上升沿触发 差异模式下每次事件到来时…

Qt_C++ RFID网络读卡器Socket Udp通讯示例源码

本示例使用的设备&#xff1a; WIFI/TCP/UDP/HTTP协议RFID液显网络读卡器可二次开发语音播报POE-淘宝网 (taobao.com) #ifndef MAINWINDOW_H #define MAINWINDOW_H#include <QMainWindow> #include <QHostInfo> #include <QNetworkInterface> #include <…

java实现rar格式转换为zip

maven 依赖 <dependency><groupId>com.github.junrar</groupId><artifactId>junrar</artifactId><version>7.5.4</version></dependency><dependency><groupId>cn.hutool</groupId><artifactId>hutoo…

XSS 跨站脚本攻击预防(文件上传)

XSS 跨站脚本攻击预防&#xff08;文件上传&#xff09; 注意&#xff1a;可以根据需求自定义&#xff0c;改造为拦截器、或者 AOP 等方式实现 import cn.hutool.extra.spring.SpringUtil; import lombok.extern.slf4j.Slf4j; import org.springframework.boot.autoconfigure.w…

PyQt5串口测试工具

笔者经常会遇到使用上位机进行相关测试的场景&#xff0c;但现成的上位机并不能完全满足自己的需求&#xff0c;或是上位机缺乏使用说明。所以&#xff0c;自己写&#xff1f; 环境说明 pycharm 2023.2.25 python 3.10 anaconda 环境配置 conda create -n envsram ##…

学生信息管理系统C++

设计目的 使学生进一步理解和掌握课堂上所学的面向对象C编程知识&#xff0c;巩固和加深学生对C面向对象课程的基本知识的理解和掌握。掌握C面向对象编程和程序调试的基本技能&#xff0c;学会利用C语言进行基本的软件设计&#xff0c;着重提高运用C面向对象语言解决实际问题的…

Go Modules 使用

文章参考https://blog.csdn.net/wohu1104/article/details/110505489 不使用Go Modules&#xff0c;所有的依赖包都是存放在 GOPATH /pkg下&#xff0c;没有版本控制。如果 package 没有做到完全的向前兼容&#xff0c;会导致多个项目无法运行(包版本需求不同)。 于是推出了g…