uni-file-picker+vue3 手动上传实列

uni-file-picker是一个基于UniApp（微信小程序、H5等平台）的文件选择组件，它允许用户从本地或相册中选取文件，并在Vue3中提供了一种简单易用的方式集成到项目中。手动上传功能通常涉及以下几个步骤：

1. 引入依赖：首先，在Vue3的组件中安装uni-file-picker插件，例如：

   npm install uni-file-picker --save

2. 使用组件：在模板部分引入`uni-file-picker`并绑定事件处理函数：

   <template>
     <uni-file-picker :on-change="handleFileChange" />
   </template>

3. 定义方法：创建一个`handleFileChange`方法来处理用户选择的文件，如解析文件URL或直接上传：

   <script>
   export default {
     methods: {
       handleFileChange(files) {
         if (files.length > 0) {
           const file = files[0];
           // 对文件进行操作，比如转化为FormData上传
           const formData = new FormData();
           formData.append('file', file.file);
           this.upload(formData); // 调用实际上传API
         }
       },
       upload(formData) {
         // 发送POST请求，将formData作为数据发送
         axios.post('/api/upload', formData).then(response => {
           console.log('上传成功:', response.data);
         }).catch(error => {
           console.error('上传失败:', error);
         });
       },
     },
   };
   </script>

4. 错误处理：别忘了处理可能出现的错误，如网络问题或服务器返回的状态码。