javascript - 我尝试使用按钮下载本地文件,但找不到该文件

标签 javascript vue.js

我想在我的页面上添加一个按钮,这样当我点击它时,它会在我使用的网络浏览器上下载一个文件。 我要下载的文件在我的项目中:

enter image description here

按钮的脚本如下:

download(){
      const link = document.createElement("a")
      link.href = "../../public/Programme robot/programme_palettisation_robot.tb"
      link.setAttribute("download", "programme_palettisation_robot.tb")
      document.body.appendChild(link)
      link.click()
      document.body.removeChild(link)
      setTimeout(function() { URL.revokeObjectURL(link.href); },1500)
    }

问题是当我点击按钮时,它说找不到文件。

enter image description here

你能帮我解决这个问题吗?

最佳答案

我假设您正在使用 Vue CLI。 Vue 在开发模式下运行本地服务器,基本上创建了一个类似于您在 dist 文件夹中看到的结构。您的链接 href 在构建时未被 webpack 解析,这就是为什么您实际上试图从根目录加载文件的原因。

因此,使用绝对文件路径应该可以解决这个问题。

link.href = "/Programme robot/programme_palettisation_robot.tb"

关于javascript - 我尝试使用按钮下载本地文件,但找不到该文件,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/67719876/

相关文章:

javascript - 从 vue-i18n 设置的 vuejs 默认属性

vue.js - 组件未显示在 Vue DevTools 中

javascript - 获取异步函数中的上一个项目

javascript - 无法更新 ReactJS 组件

javascript - 为什么我没有收到跨域错误?

javascript - 使用 CSS 和 Bootstrap 打印网页 - 第二页边距关闭

javascript - 所有请求一一返回,不是同时返回

javascript - 使用随机函数创建偶数个文本

javascript - Webpack 4 捆绑了错误的 javascript

php - 如何结合 laravel 和 vue 路由