uniapp实现打印PDF文件

最新推荐文章于 2024-04-10 15:26:45 发布
最新推荐文章于 2024-04-10 15:26:45 发布
阅读量3.2k 收藏 6
点赞数 1
分类专栏： APP 文章标签： uni-app android
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/qq_27568273/article/details/118331885
版权

主要功能为，调用系统打印服务，实现Android打印PDF文件的功能。

系统限制

现仅支持Android系统

文件路径限制

现仅支持本地绝对路径

开始使用

1、权限添加

复制代码<uses-permission android:name="android.permission.READ_EXTERNAL_STORAGE"/>
<uses-permission android:name="android.permission.WRITE_EXTERNAL_STORAGE"/>

2、uni-app调用

复制代码const printPdf = uni.requireNativePlugin('YanYu-PrintPDF');
var filePath = "/storage/emulated/0/test.pdf"; //pdf文件所在路径
printPdf.managerPrint(filePath);

详见DCLOUD插件市场

https://ext.dcloud.net.cn/plugin?id=1633

小雨_0128
关注
  • 1
    点赞
  • 踩
  • 6
    收藏
    觉得还不错? 一键收藏
  • 打赏
    打赏
  • 1
    评论
专栏目录
uniapp - 最新详细使用商米打印机等硬件设备，实现超市零售店/商超类型的打印票据、收银小票单据、打印标签、开钱箱等功能，uniapp接入商米一体机、自助终端、热敏票据打印机、云打印机等（详细示例
高级前端工程师
06-15 2908
uni-app，商米，sunmi，商米打印机，安卓and，苹果ios手机，对接商米SDK，商米自助终端，商米一体机，热敏票据打印机 小黑盒，商米云打印机，如何打印小票，商米打印插件，商米打印服务uniapp插件，连接商米打印机失败怎么办，看不懂商米sdk，如何在uniapp中接入商米打印等硬件功能，商米硬件打印详细示例代码，连接报错怎么办，Android集成商米内置打印机打印票据，一直显示初始化打印服务，没反应怎么办，没有调起摄像头，自定义调试基座，v2显示unknown 无法连接本机，打印标签会出2张，详
uni-app前端打印指定区域，生成pdf下载
weixin_43398729的博客
08-13 1156
添加依赖 yarn add html2canvas yarn add jspdf 引用文件 import html2canvas from 'html2canvas'; import jspdf from 'jspdf'; 编写js文件 // 导出页面为PDF格式 import html2Canvas from 'html2canvas' import JsPDF from 'jspdf' export default { install(Vue, options) { V
uniapp蓝牙连接打印
weixin_45616499的博客
04-10 1267
以下内容来自csdn、掘金、gitee等，以及执行操作的经验，如有侵扰，请联系删除，以下内容来自小白的整理，不喜勿喷。
uniapp页面打印pdf文件
weixin_44089042的博客
04-01 2873
uniapp页面打印pdf文件一、cmd指令安装 vue-print-nb --save二、在main.js写入引用三、使用界面四、打印效果截图 一、cmd指令安装 vue-print-nb --save npm install vue-print-nb --save 二、在main.js写入引用 import Print from 'vue-print-nb' Vue.use(Print); 三、使用界面 <div id="printMe" style="background:red;">
uni-app生成pdf，依赖html2canvas和jspdf
weixin_42011423的博客
05-14 5087
1.下载插件模块 npm install html2canvas jspdf --save 2.引入插件 import html2canvas from 'html2canvas'; import jspdf from 'jspdf'; 3.功能实现方法 // 下载pdf downPdf() { window.scrollTo(0, 0) //注意这里必须设置为顶部不然会出现图片不全 let that = this; html2canvas(document.q
uni-app 系统打印、AirPrint、支持ipad、打印图片 pdf webView文档
杨克进的博客
01-26 3916
地址：系统打印、AirPrint、支持ipad、打印图片 pdf webView文档 - DCloud 插件市场 系统打印、AirPrint、支持ipad、打印图片 pdf webView文档(ios/android) QQ群：893196612https://ext.dcloud.net.cn/plugin?id=7147
uniapp实现将页面转换成pdf（小程序、app、h5）
xiyan_yu的博客
08-25 8011
uniapp实现将页面转换成pdf（小程序、app、h5）
uniapp 在线预览pdf文件
最新发布
04-11
本话题聚焦于使用uniapp在线预览PDF文件，这是一个常见的功能需求，特别是在文档共享、阅读或教育类应用中。下面将详细阐述如何实现这一功能。 首先，我们需要了解uniapp的基本概念。uniapp是由DCloud（即海马云）...
uniapp 链接热敏打印机 打印小票（非完整demo）
09-27
uni-app并不内置打印功能，因此我们需要找到合适的第三方插件来实现这一功能。通常，可以在uni-app的插件市场（如HBuilderX的Marketplace）搜索“打印”插件，选择支持热敏打印机的插件并按照插件文档进行安装。安装...
uniapp预览pdf的相关文件；pdf阅读器
05-27
在uniapp中预览PDF文件是一项常见的需求，这通常涉及到文档展示功能，以便用户能够查看和交互PDF文档。本篇文章将深入探讨如何在uniapp中实现PDF预览，并介绍相关知识点。 首先，我们需要了解PDF（Portable ...
iframe标签实现pdf预览功能
05-29
在本篇文章中，我们将深入探讨如何使用`iframe`标签结合Vue和React框架来实现在网页中预览PDF文件。 首先，`iframe`标签的基本用法如下： ```html <iframe src="path_to_your_pdf.pdf" width="100%" height="500">...
uni-app从入门到精通-10311421.pdf
05-28
uniapp，现在是很流行的，跨端用起来还是比较快的，大家可以尝试一下，这是一篇不错的文档，下载下来看一看。希望大家都来尝试。小程序还可以，不涉及到太多的原生调用，还是不错的，
uni-app蓝牙打印+微信小程序蓝牙打印完整demo运行版
03-01
1.uni-app蓝牙打印+微信小程序蓝牙打印完整demo运行版 2.esc+tsc+cpcl三种指令的封装和测试代码 3.代码下载直接加入HBuilder X和微信开发者工具可直接调试运行
在UniApp中集成Lodop实现APP打印标签功能-库文件源代码
08-11
资源描述： 本资源提供了Lodop实现在UniApp应用程序中打印标签的功能的库文件源代码。在本资源中，我们将介绍如何使用Lodop在UniApp中打印标签，包括如何定义标签样式、打印内容和打印方式等。此外，我们还将提供一些示例代码和相关的技术资料，帮助读者更好地理解和掌握该技术的实现原理和应用场景。 内容概要： 在本资源中，我们将介绍如何使用Lodop在UniApp中打印标签。我们将首先介绍Lodop的基本概念和使用方法，然后详细介绍如何定义标签样式、打印内容和打印方式等。在示例代码部分，我们将提供一些简单的示例代码，用于演示如何使用Lodop打印标签。最后，我们还将提供一些相关的技术资料，包括Lodop的文档和示例代码等，帮助读者更好地理解和掌握该技术的实现原理和应用场景。 适用人群： 本资源适用于需要在UniApp应用程序中打印标签的开发人员、测试人员和运维人员等。 使用场景及目标： 本资源的使用场景包括在UniApp应用程序中打印标签的开发和测试、相关应用程序的维护和优化以及相关技术的研究和探索。本资源的目标是为读者提供一份详细的技术文档和实现示例，帮助读者更好地
pdf.js使用文件流预览pdf
09-27
这对于处理大型PDF文件非常有用，可以避免内存占用过多的问题。PDF.js支持文件流预览，意味着我们可以从服务器获取PDF的数据流，然后逐步解析和显示内容，而不需要等待整个文件下载完成。 要使用PDF.js实现文件流...
uniapp android离线打包预览pdf
weixin_44941683的博客
03-15 228
uniapp离线打包 android显示pdf
蓝牙连接便携式打印机（芝柯） uniapp
he3236220的博客
01-16 2808
【代码】蓝牙连接便携式打印机（芝柯）
uni-app 微信小程序使用 web-view 预览PDF
专注基础架构领域
06-21 3258
1、使用uni-pp开发微信小程序，上线之后发现Android无法加载览PDF，这里我们判断一下在不同系统使用不同的方式。 2、iOS可以直接在线预览、Android先下载再访问。 ...
uniapp实现打印功能
02-22 2794
通过ZPL实现安卓端打印标签功能
uniapp中显示pdf文件
06-13
在uniapp中可以使用插件或第三方库来显示PDF文件。以下是两种常见的方式： 1. 使用插件 可以使用uni-extend插件中的pdf插件来显示PDF文件。首先需要安装该插件： ``` npm install uni-extend-pdf ``` 然后在页面中引入该插件，并使用`pdf-viewer`组件来显示PDF文件： ```html <template> <pdf-viewer :src="pdfUrl"></pdf-viewer> </template> <script> import pdfViewer from 'uni-extend-pdf/components/pdf-viewer/pdf-viewer.vue' export default { components: { pdfViewer }, data() { return { pdfUrl: 'http://example.com/example.pdf' } } } </script> ``` 2. 使用第三方库 可以使用pdf.js这个第三方库来显示PDF文件。可以使用uni-app的`wx.downloadFile`方法下载PDF文件，然后使用pdf.js解析和显示文件。以下是一个示例代码： ```html <template> <canvas id="pdf-canvas"></canvas> </template> <script> import PDFJS from 'pdfjs-dist' export default { mounted() { const canvas = document.getElementById('pdf-canvas') PDFJS.getDocument('http://example.com/example.pdf').then(pdf => { pdf.getPage(1).then(page => { const viewport = page.getViewport({ scale: 1 }) const context = canvas.getContext('2d') canvas.height = viewport.height canvas.width = viewport.width page.render({ canvasContext: context, viewport: viewport }) }) }) } } </script> ``` 以上两种方式都可以在uniapp中显示PDF文件，具体选择哪种方式取决于个人需求和项目要求。

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

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

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包

打赏作者

小雨_0128

你的鼓励将是我创作的最大动力

¥1 ¥2 ¥4 ¥6 ¥10 ¥20
扫码支付：¥1
获取中
扫码支付

您的余额不足，请更换扫码支付或充值

打赏作者

实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

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

余额充值