对比:
在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的区别的更多相关文章

  1. Python中的全局变量与局部变量的区别

    全局变量与局部变量两者的本质区别就是在于作用域 用通俗的话来理解的话, 全局变量是在整个py文件中声明,全局范围内都可以访问 局部变量是在某个函数中声明的,只能在该函数中调用它,如果试图在超出范围的地 ...

  2. 总结javascript中的全局变量和局部变量的区别以及声明函数和调用函数的区别

    <!DOCTYPE html> <html> <head lang="en"> <meta charset="utf-8&quo ...

  3. Module Federation 模块联邦 在Vue3中使用Vue2搭建的微服务

    前言: 备注:本文基于对webpack Module Federation有一定了解的情况下 一般情况下使用模块联邦都是会使用相同的版本,如Vue2的组件时在Vue2中使用,但我为什么会在Vue3项目 ...

  4. 【转载】vue3 中如何像 vue2 的 extend 一样挂载未挂载的组件,拿到标签本身($el)

    原文地址:https://blog.csdn.net/qq_39953537/article/details/110437554 vue3 中如何像 vue2 的 extend 一样挂载未挂载的组件, ...

  5. 关于在vue3中使用vuex与在vue2中使用vuex的区别

    首先vue2中vuex版本是4.x以下,vue3中使用vuex需要保证vuex版本在4.x及以上. 以下说一说怎么在vue3中使用vuex,与vue2大同小异 首先在views新建一个store文件夹 ...

  6. vue3中使用axios如何去请求数据

    在vue2中一般放在created中,但是在vue3中取消了created生命周期,请求方式有两种 直接在setup中去获取数据 setup(props) { const data = reactiv ...

  7. vue3中watch函数

    watch 监听普通类型 let count = ref(1); const changeCount = () => { count.value+=1 }; watch(count, (newV ...

  8. vue3与vue2的区别

    全局属性 vue2 对于一些第三方插件,vue2中通常使用prototype原型来挂载到vue对象中 import Vue from 'vue' Vue.prototype.$http=Axiox V ...

  9. vue 3 学习笔记 (七)——vue3 中 computed 新用法

    vue3 中 的 computed 的使用,由于 vue3 兼容 vue2 的选项式API,所以可以直接使用 vue2的写法,这篇文章主要介绍 vue3 中 computed 的新用法,对比 vue2 ...

  10. 在vue3中使用router-link-active遇到的坑

    在使用 router-link-active 设置链接激活时CSS类名时,发现在例如 /member/order 和 /member/order/:id 这两个都包含 /member/order的路由 ...

随机推荐

  1. Rust函数参数传递的一个观点

    Q5: 一个函数的观点A5: Rust中的每个函数都是自治的,在每一个函数体中,相当于重新开辟了一个新的领域.将参数传递给函数参数,与let声明一个绑定是一样的规则. 1 ``` 2 // 所有权语义 ...

  2. HTML5新特性之Web Storage

    Web Storage是HTML5新增的特性,能够在本地浏览器存储数据,对数据的操作很方便,最大能够存储5M. Web Storage有两种类型: SessionStorage 和 LocalStor ...

  3. React后台管理系统05 引入UI组件库

    使用命令引入UI组件库 npm install antd --save 使用命令安装ant的图标库 npm install --save @ant-design/icons ,注意这里的@后面是一个a ...

  4. Codeforces Round #877 (Div. 2) A-E

    A 代码 #include <bits/stdc++.h> using namespace std; using ll = long long; bool solve() { int n; ...

  5. 反向代理后 location 被替换成本机域名。

    反向代理后 location 被替换成本机域名. 和上次写博客系统遇到的问题一样. 反向代理后,系统header中的location参数 域名自动被替换成本机域名了,本地测试没有问题,服务器反向代理就 ...

  6. 使用Python接口自动化测试post请求和get请求,获取请求返回值

    引言我们在做python接口自动化测试时,接口的请求方法有get,post等:get和post请求传参,和获取接口响应数据的方法: 请求接口为Post时,传参方法我们在使用python中request ...

  7. Unity的IActiveBuildTargetChanged:深入解析与实用案例

    Unity IActiveBuildTargetChanged Unity IActiveBuildTargetChanged是Unity引擎中的一个非常有用的功能,它可以让开发者在切换构建平台时自定 ...

  8. 动态SQL与静态SQL使用场景

    静态SQL 和动态SQL 的区别 静态SQL(或嵌入式SQL) 是应用程序中的 SQL 语句,它们在运行时不会更改,因此可以硬编码到应用程序中. 动态 SQL是在运行时构造的 SQL 语句:例如,应用 ...

  9. 2023-07-12:RocketMQ如何做到消息不丢失?

    2023-07-12:RocketMQ如何做到消息不丢失? 答案2023-07-12: RocketMQ通过刷盘机制.消息拉取机制和ACK机制等多种方式来确保消息投递的可靠性,防止消息丢失. 1.刷盘 ...

  10. 客户端软件接入QQ和Github第三方登录

    原文地址: 客户端软件接入QQ和Github第三方登录 - Stars-One的杂货小窝 之前一直计划给现在系统加上第三方登录的功能,最近终于是有了时间去研究实现 因为逻辑实在有些繁琐,下面的记录尽量 ...