ant design vue 上传图片base64转码


需求,上传的图片传给后台,包括后台返回的都是base64类型的。

前端把上传的图片转成base64传给后台

 

 

<a-form-model-item>
      <a-upload
         name="file"
         list-type="picture-card"
         class="avatar-uploader"
         :show-upload-list="false"
         :multiple="false"
         :before-upload="beforeUpload"
         :action="uploadUrl"
         :customRequest="selfUpload"
         @change="handleChangeFile"
         >
           <a-avatar
                v-if="formImg.projectRendering"
                 :src="downloadUrl + '/' + formImg.projectRendering"
                 alt="avatar"
                 shape="square"
              />
             <div v-else>
                  <a-icon :type="loading ? 'loading' : 'plus'" />
                  <div class="ant-upload-text">导入图片</div>
              </div>
         </a-upload>
</a-form-model-item>

  

//对上传的文件处理
selfUpload ({ action, file, onSuccess, onError, onProgress }) {
     console.log(file, 'action, file');
     const base64 = new Promise(resolve => {
         const fileReader = new FileReader();
         fileReader.readAsDataURL(file);
         fileReader.onload = () => {
              resolve(fileReader.result);
              // this.formImg = fileReader.result;
          }
      });
}

  

 


免责声明!

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



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