如何在前端提供实现下载文件

有这样一个需求，我所使用的框架是 react，需要给用户一个模板 excel 进行参考，因为就这一个文件要下载，所有就不放在后端，直接放在前端这边进行下载了。

假设这个文件的名称叫做 template.xlsx

具体的做法是：

1. 把 excel 文件放到 public 文件夹中
2. 这样就可以拿到下载链接了 , /template.xlsx。 需要注意的是如果你的部署路径不是 /，而是类似于 /webapp 这样的，你需要在前面加上它。也就是变成`/webapp/template.xlsx 这样部署的时候，下载路径才是正确的。
3. 给 button 绑定 onClick 方法，这样点击的时候触发下载。用下面的写法，然后把 url 传进来就可以了。

export function downloadFileFromURL(url: string, filename?: string) {
  const a = document.createElement("a")
  a.href = url
  a.download = filename ?? ""
  a.target = "_blank"
  document.body.appendChild(a)
  a.click()
  document.body.removeChild(a)
}

也可以直接用这个 npm pkg，封装了下载方法 file-downloader