关于antd Upload上传预览模糊解决方法

1.先看看转换的代码

1.base64转换为文件

dataURLtoFile(dataurl, filename) {
    const arr = dataurl.split(',');
    const mime = arr[0].match(/:(.*?);/)[1];
    const bstr = window.atob(arr[1]);
    let n = bstr.length;
    const u8arr = new Uint8Array(n);
    while (n--) {
        u8arr[n] = bstr.charCodeAt(n);
    }
    return new File([u8arr], filename, { type: mime });
  },

2.file转为base64

getPicBase64(file) {
    return new Promise((resolve, reject) => {
      const reader = new FileReader();
      reader.readAsDataURL(file);
      reader.onloadend = function (e) {
        const picBase64Temp = e.target.result;
        resolve(picBase64Temp);
      };
    });
  },

2.正式开始 需要定义 Upload - previewFile让他不对图片做任何处理

1.自己写一个 previewFile，不对图片做任何处理，直接 return，这样预览的时候就不会走组件默认的previewImage了， 并且把base64 赋值给resolve出来 这样在预览弹窗中看到的也是清晰的

// 不对图片做任何处理
previewFile(file) {
    const Pro = misc.getPicBase64(file);
    return Pro;
}

<Upload
   previewFile={this.previewFile}
>