对比:
在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. 【后端面经】MySQL主键、唯一索引、联合索引的区别和作用

    目录 0. 简介 1. 主键 2. 唯一索引 3. 联合索引 4. 索引对数据库操作的影响 5. 其他索引 5.1 普通索引 5.2 全文索引 5.3 前缀索引 6. 总结 7. 参考资料 0. 简介 ...

  2. IDEA中去除竖线

    IDEA中去除竖线 使用IDEA时突然多出了一条竖线 , 进入设置取消竖线

  3. PHP支付接口签名生成数据

    <?php //作者主页 https://www.woailunwen.com $pay_memberid = '商户号'; $pay_orderid = '订单号'; $pay_amount ...

  4. CF1794B Not Dividing题解

    如果 \(a_i\) 可以整除 \(a_{i - 1}\),只要在 \(a_i\) 上 \(+1\) 即可,这样 \(a_i \bmod a_{i - 1} = 1\) 就满足题目要求了,如果这样算来 ...

  5. YOLOX目标检测实战:LabVIEW+YOLOX ONNX模型实现推理检测(含源码)

    目录 前言 一.什么是YOLOX 二.环境搭建 1.部署本项目时所用环境: 2.LabVIEW工具包下载及安装: 三.模型的获取与转化[推荐方式一] 1.方式一:直接在官网下载yolox的onnx模型 ...

  6. C语言指针--指针中的const

    文章目录 前言 一.const 1.什么是const 2.const的使用 二.const修饰一级指针 1.const放在 `*` 左边 2.const在`*`右边 三.const修饰二级指针 1.c ...

  7. [爬虫]2.3.1 使用Python操作文件系统

    Python提供了许多内置库来处理文件系统,如os.shutil和pathlib等,这些库可以帮助你创建.删除.读取.写入文件和目录. 读取文件 在Python中,你可以使用内置的open函数来打开一 ...

  8. HTML超文本标记语言4

    框架标签...等等 1.框架 <frameset> 框架标签 cols="按列划分" rows="按行划分" 格式:rows="100,* ...

  9. linux-服务操作和运行级别和关机重启

    服务操作: service  network   [] systemctl     [ disable(禁用)  enable(启用)]     network [] 中为操作命令 : 1.statu ...

  10. 显示Label标签

    1 from PyQt5.QtWidgets import QApplication, QLabel, QWidget, QVBoxLayout 2 from PyQt5.QtCore import ...