vue 如何下载文件到指定的本地路径

Question

vue 如何下载文件到指定的本地路径 或者 下载到默认地址后获取默认地址

Answer 1

【相关推荐】

• 你可以看下这个问题的回答https://ask.csdn.net/questions/1093365
• 我还给你找了一篇非常好的博客，你可以看看是否有帮助，链接：vue 两种文档下载方法的实现（后台传递文件流，后台返回文件下载地址）
• 您还可以看一下 搬砖的乔布梭老师的Vue自定义组件库极简教程课程中的 发布与使用自定义组件库小节, 巩固相关知识点
  
• 除此之外, 这篇博客: vue通过在线图片地址实现图片下载中的 vue通过在线图片地址实现图片下载 部分也许能够解决你的问题, 你可以仔细阅读以下内容或跳转源博客中阅读:
  

  1、定义对应的方法。

    downloadIamge(imgsrc, name) {
        //下载图片地址和图片名
        var image = new Image()
        // 解决跨域 Canvas 污染问题
        image.setAttribute('crossOrigin', 'anonymous')
        image.onload = function () {
          var canvas = document.createElement('canvas')
          canvas.width = image.width
          canvas.height = image.height
          var context = canvas.getContext('2d')
          context.drawImage(image, 0, 0, image.width, image.height)
          var url = canvas.toDataURL('image/png') //得到图片的base64编码数据
          var a = document.createElement('a') // 生成一个a元素
          var event = new MouseEvent('click') // 创建一个单击事件
          a.download = name || 'photo' // 设置图片名称
          a.href = url // 将生成的URL设置为a.href属性
          a.dispatchEvent(event) // 触发a的单击事件
        }
        image.src = imgsrc
      },
  

  2、在自己需要的地方调用该方法即可，调用时传入图片地址imgUrl以及自定义的图片名字pic。如下。

   this.downloadIamge(imgUrl, 'pic')
  

  3、最简单的就是直接传入图片地址imgUrl，window.open(‘imgUrl’)。

  window.open('imgUrl')
  

如果你已经解决了该问题, 非常希望你能够分享一下解决方案, 写成博客, 将相关链接放在评论区, 以帮助更多的人 ^-^