uniapp的h5端在线预览文件

步骤如下:

1、下载需要准备的工具文件包
2、将其解压到/static/pdf文件夹下,如图:
解压好的文件

3、创建在线查看文件的页面:

<template>
  <view>
    <web-view :src="path"></web-view>
  </view>
</template>

<script>
export default {
  data() {
    return {
      //你的pdf链接,链接以https://开头的可在线访问的url
      fileUrl: "",
      //pdf.htm所在路径
      viewerUrl: '/static/pdf/-pdf--master/hybrid/pdf.html',
      path: ""
    };
  },
  onLoad(options) {
  	//options.url 在线预览的文件的地址
    this.fileUrl = options.url;
  },
  onShow() {
    //进行拼接即可
    this.path = `${this.viewerUrl}?url=${this.fileUrl}`
  }
}
</script>

<style>
</style>

4、准备好这些之后,只要保证你的文件地址能够访问,即可在线预览文件,如图:
在这里插入图片描述

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:/a/422882.html

如若内容造成侵权/违法违规/事实不符,请联系我们进行投诉反馈qq邮箱809451989@qq.com,一经查实,立即删除!

相关文章

程序员是如何看待“祖传代码”的?

目录 ​编辑 程序员是如何看待“祖传代码”的&#xff1f; 一、什么是“祖传代码”&#xff1f; 二、“祖传代码”的利弊 1. 可以节省开发成本 2. 可能引入安全隐患 3. 可能增加系统的维护难度 三、祖传代对程序员的影响 1. 丰富程序员的技能和知识 2. 提高程序员的创…

腾讯云学生云服务器_学生云主机_学生云数据库_云+校园特惠套餐

2024年腾讯云学生服务器优惠活动「云校园」&#xff0c;学生服务器优惠价格&#xff1a;轻量应用服务器2核2G学生价30元3个月、58元6个月、112元一年&#xff0c;轻量应用服务器4核8G配置191.1元3个月、352.8元6个月、646.8元一年&#xff0c;CVM云服务器2核4G配置842.4元一年&…

靶机渗透之My File Server: 1

Name: My File Server: 1Date release: 21 Feb 2020Author: Akanksha Sachin VermaSeries: My File ServerDownload: https://drive.google.com/uc?id1w0grAomPuFaIohBcUwDiI3QIi4fj4kje&exportdownload 对于vulnhub中的靶机&#xff0c;我们都需先下载镜像&#xff0c;然…

java的JDK选择和在win11的安装与配置

一.背景 还是公司安排的师带徒的任务。自己也回头看看。 二.JDK的选择 开发的版本java1.8。所以准备使用JDK8。 1.JDK有谁在给我们提供呢&#xff1f; 我以前知道的是sun、RedHat、Oracle、IBM。 我以前一般都是去sun的网站下载&#xff0c;后来被Oracle收购后去的Oracle…

2024年腾讯云优惠政策_腾讯云TOP10优惠活动

腾讯云服务器多少钱一年&#xff1f;62元一年起&#xff0c;2核2G3M配置&#xff0c;腾讯云2核4G5M轻量应用服务器218元一年、756元3年&#xff0c;4核16G12M服务器32元1个月、312元一年&#xff0c;8核32G22M服务器115元1个月、345元3个月&#xff0c;腾讯云服务器网txyfwq.co…

2024年腾讯云优惠券_代金券_云服务器折扣券免费领取链接

腾讯云优惠代金券领取入口共三个渠道&#xff0c;腾讯云新用户和老用户均可领取8888元代金券&#xff0c;可用于云服务器等产品购买、续费和升级使用&#xff0c;阿腾云atengyun.com整理腾讯云优惠券&#xff08;代金券&#xff09;领取入口、代金券查询、优惠券兑换码使用方法…

【中国 Elixir 开发者值得关注的 Elixir 相关动态发布网站】ElixirStatus

Elixir 是一个基于Erlang 虚拟机的函数式、面向并行的通用编程语言。如果你是一个 Elixir 开发者&#xff0c;想关注 Elixir 相关的项目动态和博客文章&#xff0c;https://elixirstatus.com/ 是一个不错的选择&#xff0c;基本每天 Elixir 相关项目开发者提交动态到该网站。

USB - Linux Kernel Menuconfig

Linux kernel&#xff0c;make menuconfig&#xff0c;和USB相关的&#xff0c;在主菜单选择Device Drivers。 Device Drivers下面&#xff0c;找到USB support。 在USB support下面&#xff0c;就可以对USB相关的item进行设置。 按照从上到下的顺序&#xff0c;打开的设置依次…

【vue3】命令式组件封装,message封装示例;(函数式组件?)

仅做代码示例&#xff1b;当然改进的地方还是不少的&#xff0c;仅作为该类组件封装方式的初步启发&#xff1b; 理想大成肯定是想要像 饿了么 这些组件库一样。 有的人叫这函数式组件&#xff0c;有的人叫这命令式组件&#xff0c;我个人还是偏向于命令式组件的称呼。因为以vu…

备战蓝桥杯————差分数组2

目录 引言 一、拼车 题目描述 解题思路及代码 结果展示 二、航班预定统计 题目描述 解题思路及代码 结果展示 总结 引言 在现代交通管理中&#xff0c;拼车服务和航班预订系统是提高资源利用效率、优化用户体验的关键技术。随着城市交通压力的增大和航空业的快速发…

深度学习 精选笔记(4)线性神经网络-交叉熵回归与Softmax 回归

学习参考&#xff1a; 动手学深度学习2.0Deep-Learning-with-TensorFlow-bookpytorchlightning ①如有冒犯、请联系侵删。 ②已写完的笔记文章会不定时一直修订修改(删、改、增)&#xff0c;以达到集多方教程的精华于一文的目的。 ③非常推荐上面&#xff08;学习参考&#x…

为什么网站页面没有被百度搜索收录?是网站被攻击了?

例如&#xff0c;为什么网站页面没有被百度搜索收录&#xff1f; 网站是否受到攻击&#xff1f; 网站索引量和网站流量之间有关系吗&#xff1f; 您在运行网站或小程序时是否有过这样的疑问&#xff1f; 下面我将为大家详细解答这些问题。 1.PC/H5站点相关 1、为什么新网站页面…

蓝桥杯Learning

Part 1 递归和递推 1. 简单斐波那契数列 n int(input())st [0]*(47) # 注意这个地方&#xff0c;需要将数组空间设置的大一些&#xff0c;否则会数组越界 st[1] 0 st[2] 1 # 这个方法相当于是递推&#xff0c;即先求解一个大问题的若干个小问题 def dfs(u):if u 1:print(…

Linux如何查看端口是否占用

在Linux中&#xff0c;有多种方法可以用来检查端口是否被占用。以下是一些常用的命令&#xff1a; netstat&#xff1a;这是一个非常通用的命令&#xff0c;可以用来查看所有端口的使用情况。如果你想查找特定的端口是否被占用&#xff0c;可以使用netstat命令配合grep。例如&…

pytest教程-13-conftest.py文件

上一小节我们学习了fixture的作用域&#xff0c;本小节我们学习一下pytest conftest.py文件的使用方法。 conftest.py文件的作用 conftest.py文件是pytest框架中的一个特殊文件&#xff0c;用于定义共享的设置、夹具(fixture)和钩子函数&#xff08;hook&#xff09;。 在py…

Java学习-简单算法与正则表达式

1.排序算法 a.冒泡排序&#xff1a; 每轮找出当前最大值&#xff0c;冒到前面&#xff0c;循环长度减一次&#xff0c;每轮从1个比较到长度减i个 b.选择排序&#xff1a; 每一轮选择每一个位置的数组元素和后面的元素比较&#xff0c;从第i1个比较到最后一个 选择排序的优化&am…

Netty的InboundHandler 和OutboundHandler

一、InboundHandler 和OutboundHandler的区别 在Netty中&#xff0c;"inbound"表示来自外部来源&#xff08;如网络连接&#xff09;的数据&#xff0c;而"outbound"则表示从应用程序发送到外部目标&#xff08;如网络连接或其他服务&#xff09;的数据。…

2、事件机制、DOM操作、jquery对尺寸操作、jquery添加和删除

一、事件机制 1、事件源.事件类型(事件处理程序) $(this)中的this不能加引号 $(#box).click(function () {$(this).css(background-color,blue)//点击颜色变为蓝色 })2、事件源.on/bind(事件类型&#xff0c;事件处理程序) $("#box").on(dbclick,function () {$(…

MySQL:错误ERROR 1045 (28000)详解

1.问题说明 有时候我们登录Mysql输入密码的时候&#xff0c;会出现这种情况&#xff1a; mysql -u root -p Enter Password > ‘密码’ 错误&#xff1a;ERROR 1045 (28000): Access denied for user ‘root’‘localhost’ (using password: YES) 或者&#xff1a;错误…

CTFHUB--文件包含漏洞--RCE

文件包含漏洞 文件包含漏洞也是一种注入型漏洞&#xff0c;其本质就是输入一段用户能够控制的脚本或者代码&#xff0c;并让服务端执行。有时候由于网站功能需求&#xff0c;会让前端用户选择要包含的文件&#xff0c;而开发人员又没有对要包含的文件进行安全考虑&#xff0c;…