vue在线预览word、excel、PDF
1、安装依赖
#docx文档预览组件
npm install @vue-office/docx vue-demi@0.13.11 -S#excel文档预览组件
npm install @vue-office/excel vue-demi@0.13.11 -S#pdf文档预览组件
npm install @vue-office/pdf vue-demi@0.13.11 -S
如果是vue2.6版本或以下还需要额外安装 @vue/composition-api
npm install @vue/composition-api -S
2、预览WORD代码
<template><div><vue-office-docx :src="docx" style="height: 100vh;" @rendered="rendered" /></div>
</template><script>//引入VueOfficeDocx组件import VueOfficeDocx from '@vue-office/docx'//引入相关样式import '@vue-office/docx/lib/index.css'export default {components: {VueOfficeDocx,},data() {return {docx: 'http://static.shanhuxueyuan.com/test6.docx', //设置文档网络地址,可以是相对地址}},methods: {rendered() {console.log('渲染完成')},},}
</script><style lang="scss" scoped></style>
3、预览EXCEL
<template><div><vue-office-excel :src="excel" style="height: 100vh;" @rendered="renderedHandler" @error="errorHandler" /></div>
</template><script>//引入VueOfficeExcel组件import VueOfficeExcel from '@vue-office/excel'//引入相关样式import '@vue-office/excel/lib/index.css'export default {components: {VueOfficeExcel,},data() {return {excel: 'http://static.shanhuxueyuan.com/demo/excel.xlsx', //设置文档地址}},methods: {renderedHandler() {console.log('渲染完成')},errorHandler() {console.log('渲染失败')},},}
</script><style lang="scss" scoped></style>
4、预览PDF
<template><div><vue-office-pdf :src="pdf" @rendered="renderedHandler" @error="errorHandler" /></div>
</template><script>//引入VueOfficePdf组件import VueOfficePdf from '@vue-office/pdf'export default {components: {VueOfficePdf,},data() {return {pdf: 'http://static.shanhuxueyuan.com/test.pdf', //设置文档地址}},methods: {renderedHandler() {console.log('渲染完成')},errorHandler() {console.log('渲染失败')},},}
</script><style lang="scss" scoped></style>
5、项目参考地址
https://github.com/501351981/vue-office.git
相关文章:
vue在线预览word、excel、PDF
1、安装依赖 #docx文档预览组件 npm install vue-office/docx vue-demi0.13.11 -S#excel文档预览组件 npm install vue-office/excel vue-demi0.13.11 -S#pdf文档预览组件 npm install vue-office/pdf vue-demi0.13.11 -S如果是vue2.6版本或以下还需要额外安装 vue/compositio…...
(源码版)2023全国大学生数学建模竞赛E题黄河水沙监测数据分析详解+Python代码源码SARIMA模型
前言 比赛结束了不知道大家情况如何,就我个人而言的话,由于工作任务比较繁重仅完成了对D题和E题的思路解答和建模,还是比较遗憾的。一个人要完成多题的建模和分析确实不是一件容易的事情,当然我向大家做出承诺历年的建模比赛我都…...
2023-09-11 C语言popen( )函数调用其他进程返回值 ( C知道辅助编写 )
老林的C语言新课, 想快速入门点此 <C 语言编程核心突破> C语言popen函数调用其他进程返回值 前言一、popen( ) 函数原型二、使用示例 (C 知道提供)总结 前言 当我们想用C语言调用一个现有程序, 并且想获取程序返回值而不是在终端输出, 那么就必须调用popen( )函数了. …...
SSTables和LSM-Tree
SSTables 可以类比Kafka:将数据按键排序写入磁盘,并分为多个段,组织段的稀疏索引,并定期合并段文件(kafka因为不存在重复数据,所以不需要合并) LSM-Tree是基于SSTables的:在内存中维…...
深圳神秘顾客(SMS)公司开展湖南长沙湘菜神秘顾客调查
民以食为天,随着国人收入提高,餐饮行业蓬勃发展,餐饮收入规模持续扩大,涌现了一批知名餐饮企业。深圳神秘顾客(SMS)公司专业专注神秘顾客15年,是中国知名神秘顾客公司,以“先服务&am…...
Logback日志记录只在控制台输出sql,未写入日志文件【解决】
原因:持久层框架对于Log接口实现方式不一样,日记记录的位置及展示方式也也不一样 mybatis-plus:configuration:log-impl: org.apache.ibatis.logging.stdout.StdOutImpl # sql只会打印到控制台不会输出到日志文件种mybatis-plus:configuration:log-impl…...
神仙院校!评级A+,每年招生1000+!
一、学校及专业介绍 西安电子科技大学(Xidian University),简称“西电” ,位于陕西省西安市,是中央部属高校,直属于教育部,为全国重点大学,位列国家“双一流”,“211工程…...
OpenHarmony:如何使用HDF驱动控制LED灯
一、程序简介 该程序是基于OpenHarmony标准系统编写的基础外设类:RGB LED。 目前已在凌蒙派-RK3568开发板跑通。详细资料请参考官网:https://gitee.com/Lockzhiner-Electronics/lockzhiner-rk3568-openharmony/tree/master/samples/b02_hdf_rgb_led。 …...
怎么在图片上编辑文字?这几种图片编辑工具了解下
在图片上编辑文字可以带来许多好处。首先,它可以更好地说明图片的内容和意义。有时候,一张图片可能不够清晰地传达想要表达的信息,但是通过在图片上添加文字说明,可以更好地让观众理解图片的意义。其次,编辑文字可以使…...
直播进入新风口:XR虚拟直播市场火爆,未来发展势不可挡
 近年来,直播行业随着技术的不断发展,呈现出了蓬勃的发展态势。在这个竞争日益激烈的直播行业中,XR虚拟直播成为了最新的风口。XR虚拟直播是一种新型的直播形式,通过虚拟现实技术,让用户置身于直播现场&a…...
安装 paddlepaddle paddleocr库,避坑指南
看到这个库我就头疼,因为换了电脑,不得不再来一遍,又是到处踩坑!拼了好几个小时,总结出来的最终解决方法!详细的傻瓜式解决! - import paddle 报错!illegal hardware instruction py…...
Java调用ChatGPT的API接口实现对话与图片生成
文章目录 步骤1:配置代理步骤2:添加依赖步骤3:编写Constants类步骤4:实现问答交互步骤5:实现图片生成 步骤1:配置代理 有些魔法是需要做配置的。否则无法正确实现代码测试。这里以我使用的工具为例说明。 …...
h5开发网站-css实现页面的背景固定定位
一、需求: 在页面滚动时,背景图片保持不变,而不是跟随滚动。 二、解决方式: 使用背景固定定位,只需要在CSS中增加一个background-attachment: fixed;属性即可。 具体代码: <div class"item_right…...
SpringBoot整合Redis完整篇
SpringBoot整合Redis完整篇 1、在springboot项目的pom.xml <?xml version"1.0" encoding"UTF-8"?> <project xmlns"http://maven.apache.org/POM/4.0.0" xmlns:xsi"http://www.w3.org/2001/XMLSchema-instance"xsi:schem…...
花见Live Wallpaper Themes 4K Pro for mac(4k视频壁纸)
如果你希望让自己的Mac桌面焕发活力,那么Live Wallpaper & Themes 4K Pro正是一款值得尝试的软件。它提供了丰富的超高清4K动态壁纸和主题,可以让你轻松打造出个性化的桌面环境。 这款软件拥有众多令人惊叹的功能。其中最值得一提的是,它…...
FastJson 漏洞复现
文章目录 FastJson 漏洞复现1. FastJson 1.2.24 反序列化导致任意命令执行漏洞1.1 漏洞描述1.2 漏洞原理1.3 漏洞复现1.3.1 环境启动1.3.2 漏洞检测1.3.3 漏洞验证 1.4 漏洞利用1.5 修复方案 2. Fastjson 1.2.47 远程命令执行漏洞2.1 漏洞描述2.2 漏洞复现2.2.1 环境启动2.2.2 …...
jeesite实现excel导入功能(保姆级图文教程)
文章目录 前言一、准备工作1.准备一个excel模板,放入static目录2.application.yml文件中设置文件存储路径3.使用easyexcel插件解析excel数据,pom文件导入easyexcel二、使用步骤1.列表页添加下载模板按钮2.表单页添加文件上传3. 创建excel解析对应实体4.后台完成文件上传代码,…...
【B树 B+树】B树、B+树理论
目录 引入B树B树定义和性质m阶B树核心特性 B树B树的查找 引入B树 满足上面两个策略就是B树: m 叉查找树中,规定除了根节点外,任何结点至少有 ⌈ m / 2 ⌉ \lceil m/2 \rceil ⌈m/2⌉ 个分叉,即至少含有 ⌈ m / 2 ⌉ \lceil m/2 \…...
CRM软件系统能否监控手机的使用
CRM可以监控手机吗?答案是不可以。CRM是一款帮助企业优化业务流程,提高销售效率的工具。例如Zoho CRM,最多也就是听一下销售的通话录音,却不可以监控手机,毕竟CRM不是一款监控软件。 CRM的主要作用有以下几点…...
hutool的HttpRequest.post的使用-包括上传文档等多个传参【总结版本】
首先hutool已经为我们封装好了远程调用的接口,我们只要将对应的传参和方式对应填写即可 hutool官方文档 1实际应用 post 常见的使用json传参,contend type为application/json RequestMapping("login") ResponseBody public static String s…...
VR数字工厂,为企业工厂打造竞争新优势
工业经济中大部分行业都是制造业,为了合力助推工业经济提质增效,谋划推进制造业数字化转型就显得尤为重要了。用VR赋能工厂数字升级,打造VR数字工厂,满足各行各业沉浸式营销展示需求。 VR数字工厂是一种全新的工业模式,…...
记一次线程堵塞(挂起)导致消息队列积压
1 背景 A服务作为生产者,每天发送上千万的mq消息,每一个消息包含500个用户ids数据。B服务作为消费者,接受MQ消息并通过http调用第三方请求进行业务处理,消费组启用了rabbitmq的多线程消费组,一个实例并发40个mq消费者…...
被问实习最大的收获是什么可以怎么回答?
最大的收获? 了解大型项目的运转过程:总工程师给开发和测试串讲需求->开发编写需求的特性说明书,完成需求方案设计和评审->编码完成后对各个场景进行自测,上库后给相关模块人进行代码检视后并修改检视意见->在每个迭代转…...
如何理解图神经网络的傅里叶变换和图卷积
图神经网络(GNN)代表了一类强大的深度神经网络架构。在一个日益互联的世界里,因为信息的联通性,大部分的信息可以被建模为图。例如,化合物中的原子是节点,它们之间的键是边。图神经网络的美妙之处在于它们能…...
国家网络安全周2023时间是什么时候?有什么特点?谁举办的?
国家网络安全周2023时间是什么时候? 2023年国家网络安全宣传周将于9月11日至17日在全国范围内统一开展。其中开幕式等重要活动将在福建省福州市举行。今年网安周期间,除开幕式外,还将举行网络安全博览会、网络安全技术高峰论坛、网络安全微视…...
windows编程之线程同步万字总结(创建线程,互斥对象,互斥事件,信号量,关键段,多线程群聊服务器)
文章目录 创建线程方法一_beginthreadex函数讲解使用示例: 方法二CreateThread函数讲解:使用示例: 互斥对象:创建互斥对象CreateMutex 互斥事件介绍创建或打开一个未命名的互斥事件对象 信号量介绍信号量的相关函数使用示例 关键段相关函数错误使用示例正确使用示例…...
Git在已有的项目中引入Submodule子模块管理:添加、更新、删除(实战示例代码)
前言 在进行Git版本控制的过程中,有时候我们需要在已有的项目中引入子模块,以便复用其他独立的Git存储库的代码或文件。本文将详细介绍如何在已有项目下添加、更新和删除Git的Submodule子模块,并提供相关的示例代码。 实战场景 假设我们已…...
内网穿透实现Windows远程桌面访问Ubuntu,简单高效的远程桌面解决方案
文章目录 前言1. ubuntu安装XRDP2.局域网测试连接3.安装cpolar内网穿透4.cpolar公网地址测试访问5.固定域名公网地址 前言 XRDP是一种开源工具,它允许用户通过Windows RDP访问Linux远程桌面。 除了Windows RDP外,xrdp工具还接受来自其他RDP客户端(如Fre…...
如何学习运营管理
运营管理(Operations Management)是一门管理学科,它关注如何高效地组织和管理企业的生产、服务、供应链和业务过程以达到组织的目标。运营管理是企业管理的一个重要领域,它包含了多个内容和职能: 生产管理:…...
腾讯云centos7.6安装部署备忘
1.Mysql 1.1 安装mysql wget http://dev.mysql.com/get/mysql-community-release-el7-5.noarch.rpm rpm -ivh mysql-community-release-el7-5.noarch.rpm yum install mysql-community-server 1.1.1 安装后重启 service mysqld restart 1.1.2 初次安装mysql,root账…...
网站如何做关键词seo优化/竞价托管一般要多少钱
近期在实施算法的时候。感觉数学知识不足了,在此大补一哈--------------------------------------------------微积分----------------------------------------------------------微积分公开课:麻省理工学院:单变量…...
会员型网站/策划方案怎么做
2019独角兽企业重金招聘Python工程师标准>>> 处理部分WordPress核心代码或功能,让你的网站更快 http://www.wpdaxue.com/speed-up-wordpress.html 转载于:https://my.oschina.net/u/1260221/blog/421850...
营销型网站建设讨论题/网络市场营销策划书
# type()的使用方法 a "123" print(type(a))>>><class str># isinstance()的使用方法: a "123" print(isinstance(a, int)) print(isinstance(a, str))>>> False True...
社区网站的建设/百度首页精简版
本人笔记本电脑安装的是 python3.7, 64位操作系统,基于x64的处理器 因为 pyaudio 暂时不支持 python3.7 和 3.8,所以若需要安装 pyaudio 需要下载 whl 文件后再离线进行安装。 首先:下载安装 pyaudio 的 whl 文件 然后按下 ctrlf 输入关键字&…...
做电商网站搭建就业岗位/电商运营培训机构哪家好
转自:http://geeklu.com/2013/03/core-text/ 本文所涉及的代码你可以在这里下载到 https://github.com/kejinlu/CTTest,包含两个项目,一个Mac的NSTextView的测试项目,一个iOS的Core Text的测试项目NSTextView和Attribued String…...
最大的网站建设/免费注册网页网址
目录 1、Collections工具类 2、Stack子类 1、Collections工具类 Collections是专为集合服务的工具类,可以进行List、Set、Map等集合的操作,比较有用 的方法如下: 1)批量添加 public static <T> boolean addAll(Recently…...