uniapp之pdf预览

最新推荐文章于 2024-09-28 18:01:12 发布

小熊代码加

最新推荐文章于 2024-09-28 18:01:12 发布

阅读量724

点赞数

分类专栏： uniapp 文章标签： javascript vue.js 前端

本文为博主原创文章，未经博主允许不得转载。

本文链接：https://blog.csdn.net/qq_36648555/article/details/122088741

版权

本文将介绍如何在uniapp中实现PDF文件的预览功能。首先，需要从https://mozilla.github.io/pdf.js/getting_started/#download 下载PDF.js库。接着，通过HTML结构配置，结合uniapp的特性，将PDF.js整合到项目中，实现预览功能。详细步骤及关键代码将在内容中详细阐述。

摘要由CSDN通过智能技术生成

1.引入 https://mozilla.github.io/pdf.js/getting_started/#download
在这里插入图片描述
2.HTML

			   <view class="enclosureList" @tap="preview(item.attachName,item.attachUrl)"  v-for="(item,index) in info.attachList" :key="index">{
   {
   item.attachName}}</view>
			   			preview(type,id){
   
				if(type.slice(-3) =='pdf'){
   
					 uni.navigateTo({
   
						  url:'/pages/my/pdf?pdfUrl='+ id
					})
					console.log(id)
				}else{
   
					this.downLoadFile(id)
				}
				
			},
			//下载文件
			downLoadFile(id){
   
				/*var fileUrl = this.content.enclosureUrl; 
				var url =decodeURIComponent(fileUrl);//对 encodeURIComponent() 函数编码的 URI 进行解码
				var reg = new RegExp(":443");
				url = url.replace(reg,"");*/
				
				//下载文件，生成临时地址
				uni.showLoading({
   
					title: '下载中...',
				})
				uni.d

最低0.47元/天解锁文章