关键 使用到 pdf.js

第一步：

下载pdf.js 文件到项目根目录

也就是这个文件

附下载地址：uni-app-pdf: 在uni-app中使用pdf.js实现在手机上打开pdf 

 也可通过其他方法下载 如npm 

第二步：

拷贝hybrid文件到项目根目录

第三步：

新建 viewPdf.vue文件

<code><template>

<view>

<web-view :src="webViewSrc"></web-view>code>

</view>

</template>

<script setup lang="ts">code>

import { ref, getCurrentInstance } from 'vue';

import config from "@/utils/http/config.js";

import { onLoad } from '@dcloudio/uni-app';

const { proxy } : any = getCurrentInstance()

let Url = ref()

Url.value = config.filesUrl.dev

let webViewSrc = ref()

let viewerUrl = '/hybrid/html/web/viewer.html'; // 根目录文件地址

onLoad((option : any) => {

// option.url 从其他需要预览pdf文件的页面传入的url

let deviceInfo = uni.getDeviceInfo()

if (deviceInfo.platform !== 'ios') {

//option.url 就是预览的pdf地址

webViewSrc.value = `${viewerUrl}?file=${Url.value + option.url}`

} else {

// ios，直接访问pdf所在路径

webViewSrc.value = Url.value + option.url

}

})

</script>

第四步：