vue3 main.js


// 导入Vue 3的createApp函数
import { createApp } from 'vue';

// 导入主组件、路由、Vuex存储、axios配置和API工具
import App from './App.vue';
import router from './router/index';
import store from './store/index';
import axios from './utils/axios';
import api from './utils/api';
import utils from './utils/utils';

// 使用createApp函数创建Vue应用实例
const app = createApp(App);

// 将路由和Vuex存储添加到Vue应用
app.use(router);
app.use(store);

// 将axios、api和utils工具绑定到Vue应用的全局属性,这样在组件内可以使用this.$http、this.$api和this.$utils来访问它们
app.config.globalProperties.$http = axios;
app.config.globalProperties.$api = api;
app.config.globalProperties.$utils = utils;

// 将Vue应用挂载到DOM元素上,'#app'是挂载点的选择器
app.mount('#app');


使用的地方

// 使用Vue 3的Composition API来获取当前组件实例,然后通过proxy对象访问组件的上下文,如方法、数据、计算属性等
import {getCurrentInstance} from "vue";
let { proxy } = getCurrentInstance();

// 打印绑定到Vue应用的axios实例,这是一个示例,展示如何在组件内使用全局属性
console.log(proxy.$http);


免责声明!

本站转载的文章为个人学习借鉴使用,本站对版权不负任何法律责任。如果侵犯了您的隐私权益,请联系本站邮箱yoyou2525@163.com删除。



 
粤ICP备18138465号  © 2018-2025 CODEPRJ.COM