vue前端导出功能在ie11中的兼容问题解决
在用vue做前端开发时,需要对列表加一个导出功能,如下写法,没有else里面的,在ie之外的浏览器都可以正常导出,可是在ie里却没有反应,后来加上else 里面这句即可以了。代码是这样的:expor(this.exportDatas).then(res => {const blob = new Blob([res.data])const fileName = ‘某表.xls’if...
在用vue做前端开发时,需要对列表加一个导出功能,如下写法,没有else里面的,在ie之外的浏览器都可以正常导出,可是在ie里却没有反应,后来加上else 里面这句即可以了。
代码是这样的:
expor(this.exportDatas).then(res => {
const blob = new Blob([res.data])
const fileName = ‘某表.xls’
if (‘download’ in document.createElement(‘a’)) {
const a = document.createElement(‘a’)
a.href = URL.createObjectURL(blob)
a.download = fileName
a.style.display = ‘none’
document.body.appendChild(a)
a.click()
URL.revokeObjectURL(a.href)
document.body.removeChild(a)
} else {
navigator.msSaveBlob(blob, fileName)
}
}).catch((error) => {
this.$message.error(error)
})
工作中遇到的问题,备份一个。
更新:
如上方法在win10 的edge浏览器中不兼容,所以代码改成如下方法就可以顺利兼容chrome , firefox, IE, edge 了
代码:
if (window.navigator && window.navigator.msSaveOrOpenBlob) {
navigator.msSaveBlob(blob, fileName)
}else{
const a = document.createElement(‘a’)
a.href = URL.createObjectURL(blob)
a.download = fileName
a.style.display = ‘none’
document.body.appendChild(a)
a.click()
URL.revokeObjectURL(a.href)
document.body.removeChild(a)
}
~~各种浏览器的兼容真烧心:)
更多推荐
所有评论(0)