vue3文件下载代码,cv就可用 :data根据后台返回数据自改


<el-icon class="operationicon" @click="download(scope.row.file_url)" style="margin:0 0 0 5px;">
   <Download />
</el-icon>

<script lang="setup">
const download = (file_url:any) => {
  console.log('file_url: ', file_url)
  let timestamp = new Date().getTime(); // 时间戳(毫秒)
  getBlob(file_url).then(blob => {
    saveAs(blob, timestamp);
  });
}
const getBlob = (url:any) => {
  return new Promise(resolve => {
    const xhr = new XMLHttpRequest();
    
    xhr.open('GET', url, true);
    xhr.responseType = 'blob';
    xhr.onload = () => {
      if (xhr.status === 200) {
        resolve(xhr.response);
      }
    };
    
    xhr.send();
  });
}
//下载文件
const saveAs = (blob:any, filename:any) => {
  var link = document.createElement('a');
  let videoFile = new File([blob], filename + ".mp4", {
    type: 'video/mp4'
  })
  // link.href = window.URL.createObjectURL(blob);
  link.href = window.URL.createObjectURL(videoFile);
  link.download = filename;
  link.click();
  // window.URL.revokeObjectURL(link.href); //释放掉blob对象
  // document.body.removeChild(link); //下载完成移除元素
}
// 下载
const saveFile = (item:any) => {
  console.log('download item: ', item)
    var link = document.createElement('a');
    link.href = item.file_url;
    link.download = 'magic.mp4'; //下载文件名
    link.click();
}

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值