vue3+ts 全局函数和变量的使用

<template><div>{{ $env }}<br />{{ $filters.format("的飞机") }}</div>
</template><script setup lang="ts">
import { getCurrentInstance } from "vue";
const app = getCurrentInstance();
console.log(app?.proxy?.$filters.format("dffdfd"));
</script><style></style>

main.ts:

import { createApp } from "vue";
import "./style.css";
import "animate.css";
import App from "./App.vue";
import ElementPlus, { Filter } from "element-plus";
import  mitt  from  'mitt'
import "element-plus/dist/index.css";
import cart from "./components/cart.vue";
import tree from "./components/tree.vue";
import * as ElementPlusIconsVue from "@element-plus/icons-vue";
const app = createApp(App);
for (const [key, component] of Object.entries(ElementPlusIconsVue)) {app.component(key, component);
}const  Mit = mitt();
app.use(ElementPlus);
declare module 'vue' {export interface ComponentCustomProperties{$Bus: typeof Mit,$filters:Filter}
}
type Filter = {format<T>(str:T):string}
app.config.globalProperties.$Bus = Mit;
app.config.globalProperties.$env = "dev";
app.config.globalProperties.$filters = {format<T>(str: T) {return  `小满-${str}`}
};
app.component("cart", cart);
app.component("tree", tree);
app.mount("#app");

效果图:

在这里插入图片描述

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

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

相关文章

07-学成在线修改/查询课程的基本信息和营销信息

修改/查询单个课程信息 界面原型 第一步: 用户进入课程列表查询页面,点击编辑按钮编辑课程的相关信息 第二步: 进入编辑界面显示出当前编辑课程的信息,其中课程营销信息不是必填项,修改成功后会自动进入课程计划编辑页面 查询课程信息 请求/响应数据模型 使用Http Client测…

11月28日作业

提示并输入一个字符串&#xff0c;统计该字符中大写&#xff0c;小写字母个数&#xff0c;数字个数&#xff0c;空格个数以及其他字符个数&#xff0c;要求使用C风格字符串完成 #include <iostream>using namespace std;int main() {string str;int A0,a0,num0,backspac…

UDS 相关时间参数

文章目录 UDS 全部时间参数UDS 应用层诊断时间参数1、P2 Client P2 Server P2* Client P2* Server 图例2、S3 Client S3 Server 图例 UDS CNA-TP网络层时间参数1、N_As/N_Ar 图例2、N_Bs 图例3、 N_Br 图例4、N_Cs 图例N_Cr 图例 UDS 网络层流控制时间参数 UDS 全部时间参数 UD…

智安网络|探索云安全合规要求:等保2.0时代的新趋势解析

随着信息技术的不断发展和应用的广泛普及&#xff0c;信息安全问题日益凸显&#xff0c;特别是在云计算时代&#xff0c;企业对于云平台的安全保障需求更为迫切。等级保护&#xff08;等保&#xff09;作为我国信息安全的基本要求&#xff0c;已经进入了2.0时代&#xff0c;对于…

深入Android S (12.0) 探索Framework之输入系统IMS的构成与启动

文章目录 前言一、输入系统的基本组成部分二、输入系统相关源码分析1、IMS 构建1.1、SystemServer # startOtherServices()1.2、InputManagerService1.3、NativeInputManager # nativeInit()1.4、NativeInputManager1.5、InputManager1.6、InputDispatcher1.7、InputReader1.8、…

网络安全小白自学

一、网络安全应该怎么学&#xff1f; 1.计算机基础需要过关 这一步跟网安关系暂时不大&#xff0c;是进入it行业每个人都必须掌握的基础能力。 计算机网络计算机操作系统算法与数据架构数据库 Tips:不用非要钻研至非常精通&#xff0c;可以与学习其他课程同步进行。 2.渗透技…

2015年五一杯数学建模C题生态文明建设评价问题解题全过程文档及程序

2015年五一杯数学建模 C题 生态文明建设评价问题 原题再现 随着我国经济的迅速发展&#xff0c;生态文明越来越重要&#xff0c;生态文明建设被提到了一个前所未有的高度。党的十八大报告明确提出要大力推进生态文明建设&#xff0c;报告指出“建设生态文明&#xff0c;是关系…

【Python】torch.exp()和 torch.sigmoid()函数详解和示例

本文对torch.exp&#xff08;&#xff09;和 torch.sigmoid&#xff08;&#xff09;函数进行原理和示例讲解&#xff0c;以帮助大家理解和使用。 目录 torch.exp函数原理运行示例 torch.sigmoid&#xff08;&#xff09;函数原理运行示例torch.sigmoid相关知识 结合运行 torc…

2023网络安全产业图谱

1. 前言 2023年7月10日&#xff0c;嘶吼安全产业研究院联合国家网络安全产业园区&#xff08;通州园&#xff09;正式发布《嘶吼2023网络安全产业图谱》。 嘶吼安全产业研究院根据当前网络安全发展规划与趋势发布《嘶吼2023网络安全产业图谱》调研&#xff0c;旨在进一步了解…

Net6.0或Net7.0项目升级到Net8.0 并 消除.Net8中SqlSugar的警告

本文基于NetCore3.1或Net6.0项目升级到Net7.0&#xff0c;参考连接&#xff1a;NetCore3.1或Net6.0项目升级到Net7.0-CSDN博客 所有项目按照此步骤操作一遍&#xff0c;完成后再将所有引用的包&#xff08;即 *.dll&#xff09;更新升级到最新版&#xff08;注意&#xff1a;有…

在 CentOS 7 上安装 MySQL 8

在 CentOS 7 上安装 MySQL 8 步骤 1: 添加 MySQL Yum 存储库 首先&#xff0c;我们需要添加 MySQL Yum 存储库。打开终端并执行以下命令&#xff1a; sudo yum install -y https://repo.mysql.com/mysql80-community-release-el7-3.noarch.rpm步骤 2: 导入 MySQL GPG 公钥 …

python-爬虫(可直接使用)

爬虫&#xff08;Web Scraping&#xff09;是指通过编程自动化地获取互联网上的信息的过程。爬虫的目的通常是从网页中抓取数据&#xff0c;进行数据分析、处理或展示。以下是爬虫的基本流程和一些重要的概念&#xff1a; 爬虫基本流程&#xff1a; 确定目标&#xff1a; 确定要…

【Rust】快速教程——自定义类型、数字转枚举、Cargo运行

前言 超过一定的年龄之后&#xff0c;所谓人生&#xff0c;无非是一个不断丧失的过程而已。宝贵的东西&#xff0c;会像梳子豁了齿一样从手中滑落下去。你所爱的人会一个接着一个&#xff0c;从身旁悄然消逝。——《1Q84》 \;\\\;\\\; 目录 前言自定义类型数字转枚举Cargo.tom…

CorelDRAW Graphics Suite2023破解版含2024最新注册机下载

CorelDRAW Graphics Suite2023是Corel公司的平面设计软件&#xff1b;该软件是Corel出品的矢量图形制作工具软件&#xff0c;这个图形工具给设计师提供了矢量动画、页面设计、网站制作、位图编辑和网页动画等多种功能。在日常科研绘图中&#xff0c;若较为轻量&#xff0c;通常…

处理器及微控制器:XCZU15EG-2FFVC900I 可编程单元

XCZU15EG-2FFVC900I参数&#xff1a; Zynq UltraScale™ MPSoC 系列基于 Xilinx UltraScale™ MPSoC 架构。该 Zynq UltraScale™ MPSoC 器件集成了功能丰富的 64 位四核或双核 Arm Cortex-A53 和双核 Arm Cortex-R5F 处理系统&#xff08;基于 Xilinx UltraScale™ MPSoC 架…

六、Lua运算符

文章目录 一、Lua 运算符&#xff08;一&#xff09;算术运算符&#xff08;二&#xff09;关系运算符&#xff08;三&#xff09;逻辑运算符&#xff08;四&#xff09;其他运算符 二、运算符优先级 一、Lua 运算符 运算符是一个特殊的符号&#xff0c;用于告诉解释器执行特定…

443. 压缩字符串

这篇文章会收录到 : 算法通关村第十二关-黄金挑战字符串冲刺题-CSDN博客 压缩字符串 描述 : 给你一个字符数组 chars &#xff0c;请使用下述算法压缩&#xff1a; 从一个空字符串 s 开始。对于 chars 中的每组 连续重复字符 &#xff1a; 如果这一组长度为 1 &#xff0c;…

MySQL- CRUD

一、INSERT 添加 公式 INSERT INTO table_name [(column [, column...])] VALUES (value [, value...]); 示例&#xff1a; CREATE TABLE goods (id INT ,good_name VARCHAR(10),price DOUBLE ); #添加数据 INSERT INTO goods (id,good_name,price ) VALUES (20,华为手机,…

万界星空科技生产管理mes系统种的工艺确认流程

MES工艺流程是制造执行系统的核心部分&#xff0c;它涵盖了整个生产过程&#xff0c;包括物料管理、生产计划、生产执行、质量管理、维修保养等方面&#xff0c;可以有效地提高生产效率和产品质量。 一、确认追溯模型&#xff1a; 以工艺文件为确认对象&#xff0c;以产品生产…

【算法】一个简单的整数问题(树状数组、差分)

题目 给定长度为 N 的数列 A&#xff0c;然后输入 M 行操作指令。 第一类指令形如 C l r d&#xff0c;表示把数列中第 l∼r 个数都加 d。 第二类指令形如 Q x&#xff0c;表示询问数列中第 x 个数的值。 对于每个询问&#xff0c;输出一个整数表示答案。 输入格式 第一行…