全局注册axios

src/components/login/Index.vue

@@ -18,20 +18,20 @@
 </template>
 
 <script setup>
-import { ref, reactive } from "vue"
+import { ref, reactive, getCurrentInstance } from "vue"
 import { useRouter, useRoute } from "vue-router"
 import { ElMessage } from 'element-plus'
-import axios from 'axios'
-axios.defaults.baseURL = '/api'
 
 const router = useRouter();
 const route = useRoute(); //获取上层路由传递的参数
 let user = reactive({ tel: "", pwd: "" });
 
+//取得全局 axios
+const {appContext} = getCurrentInstance();
 
-function login() {
+async function login() {
     //登陆
-    axios.post('/auth/login', null,
+    await appContext.config.globalProperties.$http.post('/auth/login', null,
         {
             params: {
                 telephone: user.tel,

src/components/register/Index.vue

@@ -21,20 +21,19 @@
 </template>
 
 <script setup>
-import { ref, reactive } from 'vue'
+import { ref, reactive, getCurrentInstance } from 'vue'
 import { useRoute, useRouter } from 'vue-router'
 import { ElMessage } from 'element-plus'
-import axios from 'axios'
-axios.defaults.baseURL = '/api'
 
 const router = useRouter()
 const route = useRoute()//获取上层路由传递的参数
 
+const {appContext} = getCurrentInstance()
 
 let user = reactive({ name: '', tel: '', pwd: '' })
 
-function register() {
-    axios.post('/auth/register', null,
+async function register() {
+    await appContext.config.globalProperties.$http.post('/auth/register', null,
         {
             params: {
                 name: user.name,

src/main.js

@@ -3,8 +3,9 @@ import { createApp } from "vue";
 import App from "./App.vue";
 import ElementPlus from "element-plus";
 import "element-plus/dist/index.css";
-
 import { createRouter, createWebHistory } from "vue-router";
+import axios from "axios";
+axios.defaults.baseURL = '/api'
 
 const routes = [
   { path: "/login", component: () => import("./components/login/Index.vue") },
@@ -19,9 +20,9 @@ const router = createRouter({
   history: createWebHistory(),
   routes,
 });
-
-
+//https://cn.vuejs.org/api/application.html#app-config-compileroptions
 let app = createApp(App);
 app.use(router);
 app.use(ElementPlus);
+app.config.globalProperties.$http = axios;
 app.mount("#app");