uniapp判断是图片还是pdf,如果是pdf则进行下载预览

huang_jimei2024-04-25 17:58

一、附件中有图片也有pdf，需要进行预览，图片可直接预览，而pdf是下载后再预览

二、主要代码

javascript 复制代码

<view class="fj-row" v-for="(item,index) in formDetail.attachmentRespVOS" :key="index">
		<view class="drow" @click="preViewImg2(item)">			
		    <view class="fjtitle">{{item.title}}</view>
		</view>
		<view class="fj-line"></view>
</view>

javascript 复制代码

//预览图片
			preViewImg2(row){			
				var imgArr = [];
				//给整个数组的文件列表都加上api
				for (var i = 0; i < this.formDetail.attachmentRespVOS.length; i++) {
					imgArr[i] = config.imgBaseUrl + this.formDetail.attachmentRespVOS[i].fileUrl
				}
				var nowUrl=config.imgBaseUrl+row.fileUrl;//当前的预览路径
				var arr1 = nowUrl.split(".");
				var len1=arr1.length-1;
				var type1=arr1[len1];
				if(type1=='pdf'){
					this.Download(nowUrl)
				}else{
					uni.previewImage({
						current: nowUrl,
						urls: imgArr
					})
				}
			},

javascript 复制代码

//下载
			Download(urls) {
				uni.downloadFile({
					url: urls,//下载地址接口返回
					success: (data) => {
						if (data.statusCode === 200) {
							//文件保存到本地
							uni.saveFile({
								tempFilePath: data.tempFilePath, //临时路径
								success: function(res) {
									uni.showToast({
										icon:'loading',
										mask: true,
										title: '正在下载中...', //保存路径
										duration: 2000,
									});
									setTimeout(() => {
										//打开文档查看
										uni.openDocument({
											filePath: res.savedFilePath,
											success: function(res) {
												// console.log('打开文档成功');
											}
										});
									}, 2000)
								}
							});
						}
					},
					fail: (err) => {
						console.log(err);
						uni.showToast({
							icon: 'none',
							mask: true,
							title: '失败请重新下载',
						});
					},
				});
			},