如何vue3中使用全局变量,与Vue2的区别
对比:
在vue2.x中我们挂载全局变量或方法是通过是使用Vue.prototype.$xxxx=xxx的形式来挂载,然后通过this.$xxx来获取挂载到全局的变量或者方法
但是 在vue3.x中显然是不行滴,在setup里面我们都获取不到this,但是 别怕 vue3.x官网给我们提供了新的方法 叫:globalProperties 。添加一个可以在应用的任何组件实例中访问的全局 property。组件的 property 在命名冲突具有优先权
举例: 比如我们挂在一下axios
// 在main.js上
import { createApp } from 'vue'
import App from './App.vue'
const app = createApp(App);
import axios from './api/axios'
app.config.globalProperties.$axios = axios;
app.use(router).use(store).mount('#app');
如何使用呢
// 在页面上引用:
import { getCurrentInstance } from 'vue';
const { proxy } =getCurrentInstance();
使用
proxy.$axios({
url:'',
method:'',
})
如何vue3中使用全局变量,与Vue2的区别的更多相关文章
- Python中的全局变量与局部变量的区别
全局变量与局部变量两者的本质区别就是在于作用域 用通俗的话来理解的话, 全局变量是在整个py文件中声明,全局范围内都可以访问 局部变量是在某个函数中声明的,只能在该函数中调用它,如果试图在超出范围的地 ...
- 总结javascript中的全局变量和局部变量的区别以及声明函数和调用函数的区别
<!DOCTYPE html> <html> <head lang="en"> <meta charset="utf-8&quo ...
- Module Federation 模块联邦 在Vue3中使用Vue2搭建的微服务
前言: 备注:本文基于对webpack Module Federation有一定了解的情况下 一般情况下使用模块联邦都是会使用相同的版本,如Vue2的组件时在Vue2中使用,但我为什么会在Vue3项目 ...
- 【转载】vue3 中如何像 vue2 的 extend 一样挂载未挂载的组件,拿到标签本身($el)
原文地址:https://blog.csdn.net/qq_39953537/article/details/110437554 vue3 中如何像 vue2 的 extend 一样挂载未挂载的组件, ...
- 关于在vue3中使用vuex与在vue2中使用vuex的区别
首先vue2中vuex版本是4.x以下,vue3中使用vuex需要保证vuex版本在4.x及以上. 以下说一说怎么在vue3中使用vuex,与vue2大同小异 首先在views新建一个store文件夹 ...
- vue3中使用axios如何去请求数据
在vue2中一般放在created中,但是在vue3中取消了created生命周期,请求方式有两种 直接在setup中去获取数据 setup(props) { const data = reactiv ...
- vue3中watch函数
watch 监听普通类型 let count = ref(1); const changeCount = () => { count.value+=1 }; watch(count, (newV ...
- vue3与vue2的区别
全局属性 vue2 对于一些第三方插件,vue2中通常使用prototype原型来挂载到vue对象中 import Vue from 'vue' Vue.prototype.$http=Axiox V ...
- vue 3 学习笔记 (七)——vue3 中 computed 新用法
vue3 中 的 computed 的使用,由于 vue3 兼容 vue2 的选项式API,所以可以直接使用 vue2的写法,这篇文章主要介绍 vue3 中 computed 的新用法,对比 vue2 ...
- 在vue3中使用router-link-active遇到的坑
在使用 router-link-active 设置链接激活时CSS类名时,发现在例如 /member/order 和 /member/order/:id 这两个都包含 /member/order的路由 ...
随机推荐
- 【城南 · LlamaIndex 教程】一文看懂LlamaIndex用法,为LLMs学习私有知识
我是卷了又没卷,薛定谔的卷的AI算法工程师「陈城南」(全网平台同名)~ 担任某大厂的算法工程师,带来最新的前沿AI知识,分享 AI 有趣工具和实用玩法,包括 ChatGPT.AI绘图等,欢迎大家交流~ ...
- Spring框架参考手册(4.2.6版本)翻译——第三部分 核心技术 6.10.8 提供带注解的限定符元数据
6.1.1 提供带注解的限定符元数据 在第6.9.4节"使用@Qualifier微调基于注解的自动装配"中讨论了@Qualifier注解.该部分中的示例阐释了,在解析自动装配候选者 ...
- 安装部署 Kubernetes 仪表板(Dashboard)
简介 Kubernetes 仪表板(Dashboard)是基于网页的 Kubernetes 用户界面. 你可以使用仪表板: 展示了 Kubernetes 集群中的资源状态信息和所有报错信息. 把容器应 ...
- 大模型微调技术LoRA与QLoRA
LoRA: Low-Rank Adaptation of Large Language Models 动机 大模型的参数量都在100B级别,由于算力的吃紧,在这个基础上进行所有参数的微调变得不可能.L ...
- BitLocker加密过程中断断电,能否恢复数据?
BitLocker是Windows系统提供的磁盘加密功能,用户自己可以手动开启.在访问受BitLocker保护的磁盘分区时,需要先提供正确的密码.秘钥或是BEK文件.如果使用BitLocker将系统盘 ...
- 了解web网络基础
TCP/IP 协议:一种规则,规定不同计算机操作系统,硬件之间怎么通信的一种规则 像这样把互联网相关联的协议集合起来总称为TCP/IP协议. TCP/IP分层管理 按照组层次分为以下四层: 应用层:决 ...
- C++图像处理函数及程序(一)
C++开源项目: Boost.GIL:通用图像库 CImg :用于图像处理的小型开源C++工具包 CxImage :用于加载,保存,显示和转换的图像处理和转换库,可以处理的图片格式包括 BMP, JP ...
- Linux 软件包:lvm
lvm LVM是 Logical Volume Manager(逻辑卷管理)的简写,它是Linux环境下对磁盘分区进行管理的一种机制. Linux用户安装Linux操作系统时遇到的一个常见的难以决定的 ...
- win10安装mysql-8.0.19-winx64
第一步:去官网下载安装 (重点)第二步:先解压,然后在mysql下创建一个my.ini文件,更改my.ini文件里面的两行安装目录,第二行加上\data,my.ini文件不能多或少一个符号,内容见文章 ...
- rest-apiV2.0.0升级为simplest-api开源框架生态之simplest-jpa发布
什么是 simplest simplest 追求存粹简单和极致. 旨在为项目快速开发提供一系列的基础能力,方便用户根据项目需求快速进行功能拓展 不在去关心一些繁琐.重复工作,而是把重点聚焦到业务. 前 ...