antd下載文件小結

下載的核心方法

export const contextPath = process.env.NODE_ENV === 'production' ? '/portal' : ''; //'/portal' 對應後臺的 springboot 的contextPath

import { contextPath } from '../../../custom/contants.js';

 downLoad =(fileKey,fileName)=>{
    const params = {fileKey : fileKey};
    const downloadUrl = contextPath+'/api/regulated/info/file/downLoad';
    fetch(downloadUrl, {
      method: 'POST',
      body: window.JSON.stringify(params),
      credentials: 'include',
      headers: new Headers({
        'Content-Type': 'application/json'
      })
    }).then((response) => {
      response.blob().then(blob => {
        const aLink = document.createElement('a');
        document.body.appendChild(aLink);
        aLink.style.display='none';
        const objectUrl = window.URL.createObjectURL(blob);
        aLink.href = objectUrl;
        aLink.download = fileName;
        aLink.click();
        document.body.removeChild(aLink);
      });
    }).catch((error) => {
      console.log(error);
    });
  };

<a onClick={()=>this.downLoad(item.fileKey,item.fileName)}>下載</a>

參考文檔：React使用Post方式從服務器下載文件
react文件下載以及a.download下載的坑
React中使用fetch實現文件上傳下載(https://blog.csdn.net/qq8241994/article/details/82971233)