修改

src/App.vue

@@ -10,5 +10,5 @@ export default defineComponent({
 </script>
 <style lang="sass">
 @import url('./css/font.sass')
-@import url('//at.alicdn.com/t/font_2930340_ymozcida88.css')
+@import url('//at.alicdn.com/t/font_2930340_cjbyphc00i6.css')
 </style>

src/boot/axios.ts

 import { boot } from 'quasar/wrappers'
 import axios, { AxiosInstance } from 'axios'
-
+import {UploadSelfFile} from '@/utils/common'
 declare module '@vue/runtime-core' {
 	interface ComponentCustomProperties {
 		$axios: AxiosInstance
@@ -24,6 +24,8 @@ export default boot(({ app }) => {
 	 * @deprecated 弃用的方法
 	 */
 	app.config.globalProperties.$api = api
+	app.config.globalProperties.$UploadSelfFile = UploadSelfFile
+
 	// ^ ^ ^ this will allow you to use this.$api (for Vue Options API form)
 	//       so you can easily perform requests against your app's API
 })

src/components/common/fileUpload.vue

@@ -11,7 +11,7 @@
           <div style="display:flex;align-items:center;">
             <div>
               <a-upload v-model:file-list="data.imageList" name="file" :multiple="true"
-                action="https://www.mocky.io/v2/5cc8019d300000980a055e76" @change="handleChange">
+                action="https://www.mocky.io/v2/5cc8019d300000980a055e76" @change="uploadImg">
                 <i style="font-size:25px;cursor:pointer;" class="iconfont icon-picture"></i>
               </a-upload>
             </div>
@@ -44,16 +44,39 @@
       interface dataParam {
         [key: string]: any
       }
+      interface FileItem {
+        uid: string;
+        name?: string;
+        status?: string;
+        response?: string;
+        url?: string;
+      }
+      interface FileInfo {
+        file: FileItem;
+        fileList: FileItem[];
+      }
       const data = reactive < dataParam > ({
         isShowEdit: false,
         fileList: [],
         imageList: []
       })
+      const uploadImg = (info: FileInfo) => {
+        if (info.file.status !== 'uploading') {
+          console.log(info.file, info.fileList);
+        }
+        console.log(info,'info');
+        // if (info.file.status === 'done') {
+        //   message.success(`${info.file.name} file uploaded successfully`);
+        // } else if (info.file.status === 'error') {
+        //   message.error(`${info.file.name} file upload failed.`);
+        // }
+      };
       onMounted(() => {
 
       })
       return {
-        data
+        data,
+        uploadImg
       }
     }
   }
@@ -71,13 +94,16 @@
   .file_Space {
     display: flex;
     justify-content: space-between;
-    margin-top:10px;
+    margin-top: 10px;
     align-items: center;
   }
-  .q-field__control{
-    background-color: #f6f6f6!important;
+
+  .q-field__control {
+    background-color: #f6f6f6 !important;
   }
-  .q-field--filled .q-field__control:hover:before{
+
+  .q-field--filled .q-field__control:hover:before {
     opacity: 0;
   }
+
 </style>