vue3中挂载全局公共方法以及调用

12,855 阅读1分钟

在Vue 2.0的时候通常是在 tools.js 文件写好全局方法后,在 main.js 文件 import 定义好的全局方法,使用 Vue.prototype.方法名 = 方法名 进行全局挂载,然后用 this.方法名 进行调用。但在Vue 3.0是使用 app.config.globalProperties.方法名= 方法名 进行挂载

在Vue 2.0时挂载全局方法及使用

//main.js文件中引入构造函数,并且挂载在构造函数上
import Vue from "vue";
Vue.prototype.$axios = axios;
//全局调用
this.axios()

在vue3.0时挂载全局方法及使用

//在main.js中创建实例
import { createApp } from 'vue'
import App from './App.vue'
const app = createApp(App);
//挂载方法到实例上
app.config.globalProperties.$axios = axios

//全局调用
import { getCurrentInstance } from "vue";
const { proxy }: any = getCurrentInstance();
proxy.$axios()