uniapp H5文件预览，PDF预览

怼烎@ 2022-11-18 13:36 875阅读 0赞

1.下载点击跳转下载

20210413113554991.png

2.解压，拷贝 hybrid 目录到你的项目目录下

2021041317531938.png

3.用web-view 组件,组件里面的地址是 拷贝之后的服务器域名加地址，因为我的H5配置访问路径有/dada/ ，所以不能放在根目录。

本地调试的话，建议用一个测试的PDF文件放到本地，因为远程文件会涉及到跨域

watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3FxXzM1NzEzNzUy_size_16_color_FFFFFF_t_70

  1. <template>
  2.     <view style="width: 100%;">
  3.         <web-view :src="pdfUrl"></web-view>
  4.     </view>
  5. </template>
  7. <script>
  8.     export default {
  9.         data() {
  10.             return {
  11.                 pdfUrl: ''

发表评论

表情：
评论列表 （有 0 条评论，875人围观）

还没有评论，来说两句吧...

相关阅读

    相关 pdf预览

    > 首先下载pdf.js插件，放到项目里面 > > 官网下载地址：[http://mozilla.github.io/pdf.js/getting\_started/\dow

    小咪咪小咪咪/ 0 赞/ 215 阅读

    相关 uniapp预览图片

    一、需求 最近有一个留言板需求，留言之后需要展示留言信息，信息里面除了文字还有图片。 点击图片，可预览图片。就用到了 uniapp 预览图片的功能：u

    以你之姓@以你之姓@/ 0 赞/ 1467 阅读