美文网首页
火狐创建a标签触发点击实现下载功能点击事件无效

火狐创建a标签触发点击实现下载功能点击事件无效

作者: 萘小蒽 | 来源:发表于2023-07-30 14:49 被阅读0次

    下面代码实现下载文件功能

    export function commonRequest(url,params,method="post",filename = '模板.xls') {
      return request({
        url: url,
        method:method,
        data:method.toLocaleLowerCase() !=='get'?params:'',
        responseType:'blob',
       // headers
      }).then(res=>{
        const link = document.createElement('a');
        // const filename = decodeURIComponent((getItem('contentFileName')));
        link.download = filename;
        link.href = URL.createObjectURL(res)
        link.click()
      }).catch(err=>{
        // console.log(err,666);
      })
    }
    

    问题:

    发现火狐部分版本在触发点击事件后无效;

    解决方案:

    创建事件,a标签触发

    export function commonRequest(url, params, method = "post", filename = '模板.xls') {
      return request({
        url: url,
        method: method,
        data: method.toLocaleLowerCase() !== 'get' ? params : '',
        responseType: 'blob',
        // headers
      }).then(res => {
        const link = document.createElement('a');
        link.download = filename;
        link.href = URL.createObjectURL(res);
        var evt = document.createEvent("MouseEvents");
        evt.initEvent("click", true, true);
        link.dispatchEvent(evt);
      }).catch(err => {
        // console.log(err,666);
      })
    }
    

    相关文章

      网友评论

          本文标题:火狐创建a标签触发点击实现下载功能点击事件无效

          本文链接:https://www.haomeiwen.com/subject/gtehqrtx.html