当前位置: 首页 > news >正文

vue3 H5项目中实现PDF预览

 是需要npm i vue-pdf-embed 安装这个插件的,可兼容ios/Android,下面是本人的使用实例

<template><div class="conten_box"><vue-pdf-embed v-if="pdfSource.url" :source="pdfSource" /></div>
</template>
<script setup>
import { onMounted, ref, reactive } from 'vue'
import { ylhtPdf } from "@/api/ht/index";
import VuePdfEmbed from "vue-pdf-embed";const pdfSource = reactive({url: "",cMapUrl: "https://cdn.jsdelivr.net/npm/pdfjs-dist@2.16.105/cmaps/",cMapPacked: true,
});// 获取pdf需要的url
const getInvitation = () => {ylhtPdf().then(({ data: { code, data, message } }) => {pdfSource.url = data.contract;}).catch(() => {});
}onMounted(() => {getInvitation()
})</script>

相关文章:

vue3 H5项目中实现PDF预览

是需要npm i vue-pdf-embed 安装这个插件的&#xff0c;可兼容ios/Android&#xff0c;下面是本人的使用实例 <template><div class"conten_box"><vue-pdf-embed v-if"pdfSource.url" :source"pdfSource" /></div> <…...

【WebRTC---源码篇】(十一:一)采集编码发送期间使用时间戳的详细解读

一、时间戳定义 1、 NTP时间 NtpTime RealTimeClock::CurrentNtpTime() //获取从1900-01-01 00:00.00到当前时刻经过的时间 int64_t RealTimeClock::CurrentNtpInMilliseconds() //获取从1900-01-01 00:00.00到当前时刻经过的毫秒数,ms int64_t rtc::TimeUTCMicros() //获取…...

Python学习路线 - Python语言基础入门 - Python异常、模块与包

Python学习路线 - Python语言基础入门 - Python异常、模块与包 了解异常什么是异常bug单词的诞生异常演示 异常的捕获方法为什么要捕获异常捕获常规异常捕获指定异常捕获多个异常捕获异常并输出描述信息捕获所有异常异常 else异常的finally 异常的传递Python模块什么是模块模块…...

eventbus,在this.$on监听事件时无法在获取数据

问题&#xff1a;vue中eventbus被多次触发&#xff0c;在this.$on监听事件时&#xff0c;内部的this发生改变导致&#xff0c;无法在vue实例中添加数据。 项目场景 一开始的需求是这样的&#xff0c;为了实现两个组件(A.vue ,B.vue)之间的数据传递。 页面A&#xff0c;点击页面…...

【Python必做100题】之第二十五题(统计字符)

题目&#xff1a;输入一行字符&#xff0c;分别统计出其中英文字母、空格、数字和其他字符的个数 代码如下&#xff1a; string input("请输入字符串:")char 0 number 0 space 0 other 0for i in string:if i.isalpha():char 1elif i.isdigit():number 1eli…...

开发语言:ArkTS

简介 ArkTS是华为为鸿蒙操作系统&#xff08;HarmonyOS&#xff09;开发的一种应用开发语言。这种语言在TypeScript&#xff08;简称TS&#xff09;的基础上进行了扩展&#xff0c;以更好地适应鸿蒙系统的特点和开发需求。ArkTS不仅继承了TS的所有特性&#xff0c;而且还对TS的…...

Qt中字符串转换为JS的函数执行

简介 在 QML 中&#xff0c;将 JavaScript 字符串转换为函数通常涉及使用 Function 构造函数或 eval() 函数。但是&#xff0c;QML 的环境对 JavaScript 的支持有一定的限制&#xff0c;因此不是所有的 JavaScript 功能都可以在 QML 中直接使用。 以下介绍都是在Qt5.12.1…...

TCP/IP:从数据包到网络的演变

引言 TCP/IP协议的起源可以追溯到20世纪60年代末和70年代初&#xff0c;美国国防部高级研究计划局&#xff08;ARPA&#xff09;研究开发一种可靠的通信协议&#xff0c;用于连接分散在不同地点的计算机和资源。 在当时&#xff0c;计算机之间的连接并不像现在这样普遍和便捷…...

闪存驱动器与机械硬盘与固态硬盘

目录 U盘&#xff08;闪存驱动器&#xff09; 固态硬盘&#xff08;SSD&#xff09; 机械硬盘&#xff08;HDD&#xff09; 目前主流 U盘&#xff08;闪存驱动器&#xff09; U盘是便携式存储设备&#xff0c;内部采用闪存芯片作为存储介质。它们通常具有小巧轻便的外形&am…...

java String转asc码,然后ascII再转四位的16进制数。

理论知识补充&#xff1a; char是Java中的保留字&#xff0c;表示一种数据类型。与别的语言不同的是&#xff0c;char在Java中是16位的&#xff0c;因为Java用的是Unicode编码。不过8位的ASCII码包含在Unicode编码中&#xff0c;其值对应十进制的表示范围是0~127。 char是Java八…...

零基础制作宠物用品小程序

随着人们对宠物用品的需求不断增长&#xff0c;越来越多的人开始探索如何制作一个专业的宠物用品小程序。而乔拓云作为一款功能强大的在线商城制作工具&#xff0c;成为了许多商家的首选。本文将详细介绍如何使用乔拓云制作宠物用品小程序&#xff0c;让你轻松上手&#xff0c;…...

【SpringBoot篇】解决缓存击穿问题① — 基于互斥锁方式

文章目录 &#x1f339;什么是缓存击穿&#x1f33a;基于互斥锁解决问题&#x1f6f8;思路 &#x1f3f3;️‍&#x1f308;代码实现 &#x1f339;什么是缓存击穿 缓存击穿是指在使用缓存系统时&#xff0c;对一个热点数据的高并发请求导致缓存失效&#xff0c;多个请求同时访…...

系列一、GitHub搜索技巧

一、GitHub搜索技巧 1.1、概述 作为程序员&#xff0c;GitHub大家应该都再熟悉不过了&#xff0c;很多时候当我们需要使用某一项技能而又无从下手时&#xff0c;通常会在百度&#xff08;面向百度编程&#xff09;或者在GitHub上通过关键字寻找相关案例&#xff0c;比如我想学…...

35.java后端面试宝典

一、自我介绍。 我叫什么&#xff0c;这次是应聘什么岗位&#xff0c;会什么技术&#xff0c;会什么框架&#xff0c;熟练掌握框架之间的整合技术&#xff0c;做过什么项目并且介绍主要做了什么&#xff0c;并且可以为公司带来什么价值。 总的来说&#xff0c;初级Java工程师岗…...

Linux 磁盘空间占满故障解决方法

故障排查&#xff1a; 使用命令查看磁盘使用量 # 使用人类可读的格式(预设值是不加这个选项的...) df -h # --inodes 列出 inode 资讯&#xff0c;不列出已使用 block df -i # 查看当前目录下各个文件及目录占用空间大小 du -sh / 情况一&#xff1a;一般磁盘空间满了&a…...

让生活更智能,P1600边缘智能网关带你进入智能家居新时代

一、什么是P1600边缘智能网关&#xff1f; 在科技日新月异的今天&#xff0c;我们的生活已经被各种智能产品所包围。而在这个智能化的浪潮中&#xff0c;P1600边缘智能网关以其独特的优势&#xff0c;成为了智能家居的重要组成部分。那么&#xff0c;什么是P1600边缘智能网关呢…...

Java与前端:2023年的真实状况与焦虑解读

一、引言 在2023年&#xff0c;IT圈中流传着一些关于Java和前端的言论&#xff0c;这些言论引起了广泛的关注。有些人认为“Java已死、前端已凉”&#xff0c;而另一些人则持不同观点。那么&#xff0c;这些言论背后的真相是什么&#xff1f;它们是在贩卖焦虑吗&#xff1f;本…...

adb 基本命令合集

1.获取所有的包信息&#xff1a; adb shell pm list packages com.yu.weskul 2.清除APP缓存 adb shell pm clear <package-name> 3.查看当前应用及Activity adb shell dumpsys window | findstr "mCurrentFocus" 4.查看应用详细信息 adb shell dumpsys pack…...

[RK-Linux] RK3399支持M.2 NVMe SSD启动

延续《[RK-Linux] 从主线U-Boot移植PCIe及其PHY驱动到RK3399 U-Boot》 启动流程: maskrom -> loader(从 eMMC 存储器加载) -> u-boot(从 eMMC 存储器加载)-> kernel (从 M.2 NVMe SSD 加载)-> rootfs (从 M.2 NVMe SSD 挂载)配置从 M.2 NVMe SSD 启动: …...

LTO-3 磁带机种草终于是用上了

跑来跑去&#xff0c;买了不少配件&#xff0c;终于是把这磁带机给用上了&#xff0c;已经备份好了300 多 GB 的数据。 我们用了 NAS 的数据压缩功能&#xff0c;把需要备份的文件用 NAS 压缩成一个 Zip 文件&#xff0c;如果你可以 tar 的话也行。 这样传输速度更快&#xf…...

Python多线程真能并行了吗?(GIL绕过技术全图谱:subprocess/numba/multiprocessing/cython/rustpy)

第一章&#xff1a;Python无锁GIL环境下的并发模型面试题汇总Python 的全局解释器锁&#xff08;GIL&#xff09;长期被视为多线程并发的瓶颈&#xff0c;但近年来随着 CPython 3.13 引入实验性无锁 GIL&#xff08;--without-pymalloc 配合 --with-per-object-gil 原型&#x…...

农业气象监测系统—实时感知・远程管控・智能预警

在农业现代化向纵深推进的当下&#xff0c;气象数据已成为农业生产的 “核心指挥棒”。烟台中盾信息科技有限公司&#xff08;下称 “烟台中盾科技”&#xff09;紧扣农业农村发展需求&#xff0c;以物联网、大数据技术为基石&#xff0c;打造农业气象监测系统&#xff0c;构建…...

2026降AI率工具红黑榜:降AI率网站怎么选?看完少走弯路

千笔AI、ThouPen、豆包位列红榜&#xff0c;精准适配国内高校AI率检测规范&#xff1b;黑榜需避开低质免费工具、无正规检测对接平台及改写痕迹明显的工具&#xff1b;选择时应优先匹配三维模型&#xff1a;降AI效果-学术合规性-使用成本。 一、红榜&#xff1a;10 款高分论文降…...

XC6206-1.8V是什么?有哪些作用?

本文主要介绍XC6206-1.8V是什么&#xff1f;有哪些作用&#xff1f;XC6206-1.8V是一款超低功耗、高精度的固定输出低压差线性稳压器&#xff08;LDO&#xff09;&#xff0c;核心作用是把较高电压转换成稳定的1.8V输出&#xff0c;专门为电池供电和低功耗设备设计。图文来源&am…...

OpenClaw安全加固:nanobot镜像的权限控制最佳实践

OpenClaw安全加固&#xff1a;nanobot镜像的权限控制最佳实践 1. 为什么需要关注OpenClaw的安全配置 去年夏天&#xff0c;我在本地部署OpenClaw时犯过一个致命错误——直接以管理员权限运行了未经审查的自动化脚本。结果这个脚本在半夜执行时误删了我整个项目目录的源码&…...

大语言模型推理能力突破

大语言模型原生推理能力增强课题 目录 大语言模型原生推理能力增强课题 当前LLM深层符号推理的核心瓶颈(结合场景实例) 1. 幻觉频发:符号推理的事实一致性崩塌 2. 自我纠错能力弱:缺乏闭环的校验与修正机制 3. 推理链条易断裂:长程逻辑依赖的一致性丢失 全链路原生推理能…...

ChromePass终极指南:3分钟找回Chrome浏览器所有保存密码

ChromePass终极指南&#xff1a;3分钟找回Chrome浏览器所有保存密码 【免费下载链接】chromepass Get all passwords stored by Chrome on WINDOWS. 项目地址: https://gitcode.com/gh_mirrors/chr/chromepass 你是否曾在Chrome浏览器中保存了重要账号密码&#xff0c;却…...

5分钟掌握League Akari:英雄联盟玩家的智能助手终极指南

5分钟掌握League Akari&#xff1a;英雄联盟玩家的智能助手终极指南 【免费下载链接】League-Toolkit 兴趣使然的、简单易用的英雄联盟工具集。支持战绩查询、自动秒选等功能。基于 LCU API。 项目地址: https://gitcode.com/gh_mirrors/le/League-Toolkit League Akari…...

all-MiniLM-L6-v2保姆级教程:Ollama模型卸载、版本回滚与缓存清理指南

all-MiniLM-L6-v2保姆级教程&#xff1a;Ollama模型卸载、版本回滚与缓存清理指南 1. 为什么需要管理你的Ollama模型&#xff1f; 你可能已经用Ollama成功部署了all-MiniLM-L6-v2&#xff0c;体验了它轻量高效的句子嵌入能力。但用久了你会发现&#xff0c;硬盘空间在悄悄减少&…...

Vue/React项目实战:集成docx-preview实现动态报表预览与下载功能

Vue/React项目实战&#xff1a;动态报表预览与下载的工程化实现 在数据驱动的企业应用中&#xff0c;动态生成和预览业务报表是刚需功能。想象这样一个场景&#xff1a;销售团队在CRM系统中筛选季度数据后&#xff0c;需要立即查看格式规范的业绩分析报告&#xff0c;并能一键…...