ReactJS：如何正確鏈接到下載文件？

Question

我有一個manual.pdf文件，我需要將其附加到我的文檔中。 傳統的智慧是在<a>標簽的href屬性中鏈接文件源：

<a href="../assets/img/manual.pdf" download>Manual</a>

我想，React 似乎不喜歡它。 失敗 -單擊<a>標記時未給出文件錯誤。

當它是帶有本地文件的<img>標記時，我會import logo from '../assets/img/logo.svg'; ，然后將其傳遞給src屬性，如<img src={logo} alt="brand logo" /> 。

• 我試過了——沒用。
• 給出絕對路徑 - 沒用。
• 給出一個相對路徑 - 沒用。

似乎它與<a>標簽的工作方式不同。 如何在 React 項目中正確鏈接本地文件？

PS 我聽說過 React 路由，但我沒有鏈接到任何頁面，它是用於下載文件的。

Answer 1

試試這個https://www.npmjs.com/package/file-saver (FileSaver.js)

//function for saving file
const saveManual = () => {
fileSaver.saveAs(
  process.env.REACT_APP_CLIENT_URL + "../assets/img/manual.pdf",
  "manual.pdf"
);
};

//button for calling 
<button onClick={saveManual}>
    Manual
</button>

Answer 2

嘗試這個

<Link to="/files/manual.pdf" target="_blank" download>Download</Link>

/files/manual.pdf在您的public中