基于element ui的preview-src-list放大图片预览，区分qdf和img

//fileList存放文件的信息，我这里用到了文件的路径和名称和判断pdf和图片的标志
let fileList=[{src:'图片地址',name:'文件名称',ispdf:true},{src:'图片地址',name:'文件名称',ispdf:false}]
//imgList只存放文件的路径，用于elementui<el-image>的preview-src-list属性，官方解释只能方图片的地址，否则不能预览
 let imgList=['文件路径','文件路径']

//html
<div style='height:150px;width:150px' v-for='item in fileList'>
<el-tooltip class='item' effect='dark' content='item.name' placement='top'>
<el-image :z-index='3000' fit='fill' :preview-src-list='!item.ispdf?imgList:[]' :src="ispdf?require('本地默认pdf文件的图片'):item.src" @click=imgClick(item)/>
</el-tooltip>
<span>{{item.name}}</span>
</div>

//js
imgClick(v){
if(v.ispdf){
//如果是pdf文件打开pdf文件
window.open(item.src,'_blank')
}
}

重点在于文件的列表fileList和图片路径的列表imgList不一样，预览图片的列表只能放文件地址，

:preview-src-list='!item.ispdf?imgList:[]'用于区分pdf和img，pdf不会显示在预览里面，否则会是一个加载失败的图标。

:src="ispdf?require('本地默认pdf文件的图片'):item.src"，这里是给pdf的文件一个默认图片