office文件 vue 预览_vue实现预览功能(包括doc,pdf,图片,视频)
* pdf预览*/previewPdf(row) {let type = this.iconByType(row);this.fileUrl = row.urlif (type.indexOf("doc") != -1 || type.indexOf("docx") != -1 || type.indexOf("xsl") != -1 || type.indexOf("xslx") != -1)
* pdf预览
*/
previewPdf(row) {
let type = this.iconByType(row);
this.fileUrl = row.url
if (type.indexOf("doc") != -1 || type.indexOf("docx") != -1 || type.indexOf("xsl") != -1 || type.indexOf("xslx") != -1) {
this.showDoc = true
} else if (type.indexOf("pdf") != -1) {
this.pdfUrl = "http://47.105.218.26:8888/group1/M00/00/00/rB-LJlzT042AbKdCAAiu_35Yccs182.pdf"
this.showPdf = true
} else if (type.indexOf("jpg") != -1 || type.indexOf("png") != -1 || type.indexOf("jpeg") != -1) {
this.images = this.getUrlListByName(row.url)
const viewer = this.$el.querySelector('.images').$viewer
viewer.show()
} else if (type.indexOf("avi") != -1 || type.indexOf("mp4") != -1 || type.indexOf("webm") != -1 || type.indexOf("m4v") != -1 || type.indexOf("rmvb") != -1 || type.indexOf("mpg") != -1 || type.indexOf("3gp") != -1 || type.indexOf("swf") != -1 || type.indexOf("mkv") != -1) {
this.positivePlayerOptions.sources[0].src = "//nos.netease.com/vod163/demo.mp4"
this.positivePlayerOptions.sources[0].type = "video/mp4"
this.showVideo = true
} else {
this.$message("当前文件暂不支持预览")
}
// this.showPdf = true
},
/**
* 通过文件后缀返回文件的图标
*/
iconByType(row) {
return row.fileName.substring(row.fileName.lastIndexOf(".") + 1, row.fileName.length)
},
closePreviewClick() {
if (this.showDoc == true) {
this.showDoc = false
} else if (this.showPdf == true) {
this.showPdf = false
} else if (this.showVideo == true) {
this.showVideo = false
}
},
更多推荐
所有评论(0)