浏览器中预览文件（pdf、图片文件）

本文讲解在浏览器中预览PEF文件或图片文件，思路如下：

使用window.fetch请求文件资源，生成blob对象，创建此blob对象的url，之后在浏览器中显示预览，下面是具体实现代码：

1、单击“上游供气报告”文本，调用previewFile文件，实现文件预览

<a @click="previewFile(item)">上游供气报告</a>

2、使用window.fetch请求文件

window.fetch(fileUrl)：请求文件

res.blob()：获取blob文件流对象

window.URL.createObjectURL(res)：创建url对象，返回一个链接地址，此地址指向blob文件流，将此地址赋值给previewFileUrl变量3

previewFile(file) {
    let fileUrl =  file.fileUrl
    window.fetch(fileUrl).then(res => res.blob()).then(res => {
        this.previewFileUrl = window.URL.createObjectURL(res)
    })
}, 

3、预览文件相关代码

如果是pdf文件，则在iframe中加载预览文件：

<iframe 
    :src="previewFileUrl"
    width