vue 实现单个/批量下载

项目原因需要批量下载,找到两种实现方法

1. 创建 iframe 实现

    downloadFn: function (url) {
        const iframe = document.createElement("iframe");
        iframe.style.display = "none"; // 防止影响页面
        iframe.style.height = 0; // 防止影响页面
        iframe.src = url; // 下载地址
        document.body.appendChild(iframe); // 这一行必须，iframe挂在到dom树上才会发请求
        setTimeout(()=>{
            iframe.remove();
        }, 5 * 60 * 1000);
    },

2. 创建 a 标签实现

    downloadFileByData (data, fileName) {
        const elink = document.createElement('a')
        elink.style.display = 'none'
        elink.target = '_blank'
        elink.download = fileName
        elink.href = data
        elink.setAttribute('download',fileName)
        document.body.appendChild(elink)
        setTimeout(() => {
            elink.click()
        }, 1000);
        URL.revokeObjectURL(elink.href) // 释放URL 对象
        document.body.removeChild(elink) //下载完成移除元素
    },