Vue 下载本地静态资源

  1. 项目需要下载本地的Excel文档,文档是放在本地的没有在服务器,所以需要下载本地静态资源文件,开始把文件放在了这里src目录下的assets资源文件下
    image

  2. 下载报错 找不到文件路径

  3. 查找原因是因为项目用的是vue-cli3, 在打包的时候并不知道会把assets下的文件打包在哪里,但是在build的时候发现在根目录下的文件是打包在当前路径下的
    image
    image

  4. 所以我们要把需要下载的静态资源放在public文件夹下的static文件夹下就可以了
    image

image

  1. 你可能在输入路径的时候会提示你是src,而不直接是static,但是你还是要直接输入static这个路径

示例代码

function download(){
  // window.location.href = '../assets/abc.pdf'
  // let url = '../../public/template.xlsx' 不需要写绝对路径
  let url = '/template.xlsx'
  const a = document.createElement('a')
  a.href = url
  a.download = 'template.xlsx' // 下载后文件名
  a.style.display = 'none'
  document.body.appendChild(a)
  a.click() // 点击下载
  document.body.removeChild(a) // 下载完成移除元素
}
posted @ 2022-11-03 19:37  又一岁荣枯  阅读(3375)  评论(0编辑  收藏  举报