vue 中 用window.location.href下载图片时,会跳转页面,而不会下载的解决方案

 

下载文档时,用window.location.href这个方法下载很好用,但是当想下载图片时,这个方法却直接变成了跳转。

 

于是乎,我们可以用创建元素节点的方式来实现下载图片

 

代码片段如下:

methods: {
    handleDown(row){
      //window.location.href= process.env.VUE_APP_BASE_API + row.filePath;
      console.log('下载图片')
      let a = document.createElement('a')
      let path = row.filePath.lastIndexOf('/')
      // console.log(row.filePath.substr(path+1),"row.filePath.substr(path+1)")
      a.download = row.filePath.substr(path+1)//设置下载的文件名
      a.href = process.env.VUE_APP_BASE_API + row.filePath; // 设置图片的下载地址
      a.click();//触发下载事件
      },
}

 

posted @ 2021-04-19 14:17  卖糖纸的小糖果  阅读(5463)  评论(2)    收藏  举报