uniapp 配置在线预览pnf

1. 打开网址 点击下载压缩包

2. 如图

3. 解压拖动到项目的static静态资源下 文件改名叫pdf

4. pages新建webview/index.vue 配置跳转地址 如图

<script setup>
	import {
		ref,
		computed,
		reactive,
		onMounted
	} from "vue";
	import {
		onLoad
	} from "@dcloudio/uni-app"
	const url = ref('')
	onLoad((options) => {
		url.value = '/static/pnf1/web/viewer.html?file=' + encodeURIComponent(options.url);

	})
	const props = defineProps(['url']);
	onMounted(() => {});
</script>

<template>
	<view class="">
		<web-view :src="url"></web-view>
	</view>
</template>


<style scoped lang="less"></style>

 

5. 跳转如图

6.补充 如果有报错  

Uncaught TypeError: 
Promise.withResolvers is not a function at static/pdf/web/viewer.mjs:12024

就换个pdf包  请参考第二步的截图

如果报错是 

file origin does not match viewer's"

就用vscoe全局搜索 ‘file origin does not match viewer's"’

找到后注释就可以啦