vue 文档预览打印

最新推荐文章于 2023-08-08 22:59:53 发布
最新推荐文章于 2023-08-08 22:59:53 发布
阅读量569 收藏
点赞数
文章标签： vue.js javascript 前端
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/zyy_wx/article/details/126969468
版权

需要确定文档的url地址
 

skipTCP(){
    window.open(
      "https://view.officeapps.live.com/op/view.aspx?src=" + "https://hn-cypt.oss-cn-beijing.aliyuncs.com/cdn/static/banner/112.docx",
      "_blank"
    );
},

zyy_wx
关注
  • 0
    点赞
  • 踩
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
页面实现预览和打印(页面整体打印和局部打印)
12-20
如何在html和jsp页面中实现预览和打印功能，我查找了一些资料并做了整理改进，压缩包中有两种形式的实现，可以实现页面整体预览和打印，也可以实现局部表格和文档的预览和打印功能。
JS实现局部打印和预览
weixin_30341745的博客
05-06 216
JS实现简单的页面局部打印 functionpreview(oper) ......{ if(oper<10)......{ bdhtml=window.document.body.innerHTML;//获取当前页的html代码 sprnstr="<!--startprint"+oper+"-->";//设置打印开始区域 eprnstr="<!--...
【Vue】使用print.js插件实现打印预览功能，超简单
weixin_50863323的博客
08-08 8004
【Vue】使用print.js插件实现打印预览功能，超简单
Vue中如何进行文件预览与打印？
Java徐师兄的博客
06-12 1518
本文介绍了如何在Vue中实现文件预览和打印的功能。对于PDF文件预览，我们可以使用pdf.js库来实现；对于图片文件预览，我们可以使用<img>标签来显示图片。而对于文件打印，我们可以使用浏览器的原生打印功能来实现。如果您还有其他关于Vue的问题或需求，欢迎随时联系我，我会尽力为您提供帮助。
解决vue-pdf查看pdf文件及打印乱码的问题
01-18
vue中简单使用vue-pdf预览pdf文件，解决打印预览乱码问题 vue-pdf 使用 安装 npm install –save vue-pdf 引入 import pdf from “vue-pdf 自定义封装pdf预览组件 close-on-click-modal=false show-close=...
vue前端解析word,pdf,exl,图片，视频等文件预览，支持base64格式文件 预览
04-06
vue前端解析word,pdf,exl,图片，视频等文件预览，支持base64格式文件转Blob流 预览。实现前端选择文件 直接在页面展示，或者请求后端获取base64 string 字符串 转码 在前端页面展示
基于wps在线编辑、在线预览前端vue项目，基于es6
08-23
基于wps在线编辑、在线预览前端vue项目，基于es6。本项目采用VUE + ES6实现，其中jwps.es6.js是由WPS开发组特别提供，本项目对该js做了部分调整
详解如何在vue项目中使用lodop打印插件
12-12
come on 电脑安装C-Lodop,就可以打印预览来了。 开工，翻来覆去就一个LodopFuncs.js是干货，扔到项目中。就差怎么调里面的方法了。 如何引用，当然得改造喽 LodopFuncs.js 方法改造如下 //====判断是否需要安装...
vue-element-admin.zip
06-09
初学者 需要 文档预览、下载、打印、以及数据可视化 eachart
vue中使用vue-print.js实现多页打印
11-21
本文主要介绍了vue项目中使用print.js打印，解决多页，分页，打印预览样式修改等问题。 引入安装vue-print.js cnpm i vue-printjs --save-dev 解决打印多页只出现一页问题 由于打印插件存在问题，如果打印文件超出一页，只显示一页，所以我们需要修改print.js源文件，所以只能手动下载vue-print.js到本地，做一些修改，然后引入到项目中，不能使用npm安装 下载 print.js https://github.com/zxc19890923/print/blob/master/print.js 在src目录下面创建plugins/pri
Vue实现浏览器打印功能的代码
10-15
主要介绍了Vue实现浏览器打印功能，本文通过实例代码给大家介绍的非常详细，对大家的学习或工作具有一定的参考借鉴价值,需要的朋友可以参考下
vue实现打印功能的两种方法
10-18
主要介绍了vue实现打印功能的两种方法,文中通过两种方法给大家介绍了指定不打印区域的解决方法，需要的朋友可以参考下
vue打印插件使用
11-26
vue打印插件使用 第一步: npm install vue-easy-print --save 第二步，在你的vue页面里 import vueEasyPrint from "vue-easy-print"; import demo from './your path/demo'; // in your vue [removed] export default { components: { vueEasyPrint, demo } } 第三步，加载模板: slot-scope func.getChineseNumber接收到的方法是一个将金额转换成中文的 配置props参数 // 针对分页表格模式：末尾空白行插入 spaceRow: { type:Boolean, default:false, }, // 针对分页表格模式：传入的打印数据。 tableData:{ type:Object, default() { return undefined } }, // 是否显示表格 tableShow:{ type:Boolean, default:false }, // 每页多少行 onePageRow: { type:Number, default:5, }, // 复制打印页面前调用的钩子 beforeCopy:Function, // 打印页面前调用的钩子 beforePrint:Function,
vue+element实现打印页面功能
12-29
项目中遇到了要打印页面的功能,我感觉我这个方法不太好,欢迎各位来改善指导 　　使用print插件  https://github.com/xyl66/vuePlugs_printjs 1.在min.js中引入 2.import Print from ‘@/plugs/print’ 3.Vue.use(Print) // 注册 　　<要打印内容/> 不要打印我 this.$print(this.$refs.
Vue 实现预览打印功能vue-easy-print
LeftStrang的专栏
06-14 1595
npm地址：https://www.npmjs.com/package/vue-easy-print
vue项目实现打印预览、生成（导出）文档功能
qq_41594043的博客
12-04 9869
这个功能其实也是自己学习到的，做完也有一段时间了，一直想记录总结一下，但一直没时间，今天总算闲了一点，趁一大早活还没找上门来，赶紧抓住时间鸭！ 1、打印预览 打印预览说白就是实现快速跳转新页面预览信息，新页面有打印按钮，绑定方法调起系统打印机实现打印功能。 本来我以为这个功能还要将文件先下载下来，再在浏览器进行打开。但doc和docx格式是无法直接在浏览器中显示的，还需要转换为浏览器支持的格式，这...
vue打印预览功能
郑州彭于晏
06-11 1909
参考 https://blog.csdn.net/weixin_37817251/article/details/93756262 1 npm install vue-print-nb --save 2 main.js // 打印 import Print from 'vue-print-nb' // 注册 Vue.use(Print) 3使用 3.在vue文件使用 3.1在需要打印的区域添加一个id 3.2给打印按钮添加一个v-print指令，如：v-print=“printID” <div i
vue实现打印浏览器页面功能(两种方法)
xioxi
02-18 5246
推荐使用方法二 方法一：通过npm 安装插件 1，安装 npm install vue-print-nb --save 2，引入 安装好以后在main.js文件中引入 import Print from 'vue-print-nb' Vue.use(Print); //注册 3，现在就可以使用了 div id="printTest" > 　　　　　　<p>明月照于山间</p> 　　　　　　<p>清风来于江上 </p> 　　　　&l
vue pdf在线预览打印
最新发布
09-09
在Vue项目中实现PDF文件的在线预览和打印功能的解决方案如下所示： 1. 首先，需要将后端返回的PDF文档流数据转换为正确的PDF格式数据。 2. 然后，引入并安装vue-pdf插件，可以通过npm命令进行安装：npm install --save vue-pdf。 3. 在Vue项目的页面中引入vue-pdf组件，并在components属性中注册该组件。 4. 在页面中使用vue-pdf组件进行PDF文件的预览和打印。可以使用<pdf>标签来包裹vue-pdf组件，并通过:src属性将转换好的PDF数据传入，例如:src="pdfUrl"。 5. 在预览的页面上添加打印按钮，可以通过调用vue-pdf提供的方法进行打印操作，例如在按钮的@click事件中调用$refs.pdf.print()方法。 6. 针对vue-pdf插件使用的iframe渲染存在的乱码问题，可以对其源文件进行修改来解决。 具体的代码示例如下： 引用: 第2步是下载及引入vue-pdf: ```javascript // 首先是安装vue-pdf npm install --save vue-pdf // 在页面引入 import pdf from 'vue-pdf' components: { pdf }, ``` 引用: 第3步是将转化好的PDF数据通过vue-pdf插件进行预览及打印: ```html <div v-if="src" style="overflow-y: auto;overflow-x: hidden;"> <!-- 打印直接调用vue-pdf里面的方法 --> <el-button type="primary" @click="$refs.pdf.print()" size="mini">打印</el-button> <el-button type="warning" plain @click="viewDia = false" size="mini">关闭</el-button> <div> <pdf ref="pdf" :src="pdfUrl"></pdf> </div> </div> ``` 通过以上步骤，您可以在Vue项目中实现PDF文件的在线预览和打印功能。

“相关推荐”对你有帮助么？

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值