外部讲师接口联调

src/components/project/Upload.vue

@@ -0,0 +1,36 @@
+<template>  
+    <div>  
+      <input type="file" @change="handleFileUpload" />  
+      <img :src="avatarUrl" alt="Avatar" v-if="avatarUrl" />  
+    </div>  
+  </template>  
+    
+  <script>  
+  export default {  
+    data() {  
+      return {  
+        avatarUrl: '' // 存储头像的 URL（Base64 编码或服务器 URL）  
+      };  
+    },  
+    methods: {  
+      handleFileUpload(event) {  
+        const file = event.target.files[0]; // 获取用户选择的文件  
+        if (!file) return;  
+    
+        // 创建一个 FileReader 实例  
+        const reader = new FileReader();  
+    
+        // 读取文件内容，并在读取完成后设置 img 的 src  
+        reader.onload = (e) => {  
+          this.avatarUrl = e.target.result; // e.target.result 是 Base64 编码的字符串  
+        };  
+    
+        // 读取文件内容（作为 DataURL）  
+        reader.readAsDataURL(file);  
+    
+        // 如果你需要上传文件到服务器，可以在这里添加代码  
+        // 例如，使用 Axios 发送 POST 请求到服务器  
+      }  
+    }  
+  };  
+  </script>