import{hiprint, defaultElementTypeProvider}from'vue-plugin-hiprint'// 引入后使用示例hiprint.init();// 下列方法都是没有拖拽设计页面的, 相当于代码模式, 使用代码设计页面// 想要实现拖拽设计页面,请往下看 '自定义设计'varhiprintTemplate =newhiprint.PrintTemplate();varpanel = hiprintTemplate.addPrintPanel...
与其他打印解决方案相比，vue-plugin-hiprint具有显著的优势。它的出现，不仅简化了打印流程，还大大提高了打印的灵活性和效率。无论是简单的标签打印还是复杂的报表输出，vue-plugin-hiprint都能完美胜任。更重要的是，它为开发者提供了一个更加便捷的工作环境，让原本枯燥乏味的任务变得有趣起来。在你使用过的所有打...
token: "vue-plugin-hiprint", // 与打印客户端相同的 token }) 初始化 const hiprintTemplate = new hiprint.PrintTemplate() // 因为我个人觉的直接通过打印某个元素区域最好用(最好上手)所以使用的是打印html的方式 hiprintTemplate.printByHtml(this.$refs.printContent,{}); hiprintTemplate.printByHtml2(...
500)},print() {this.waitShowPrinter=truethis.hiprintTemplate.print(this.printData, {}, {callback:() =>{this.waitShowPrinter=false}})},toPdf() {this.hiprintTemplate.toPdf(this.printData,'打印预览pdf');},}}/deep/.ant-modal
vue-plugin-hiprint 相比上面方案,自带模板设计,并且提供打印客户端,基本满足需求 缺点:hiprint 是闭源的 最后选择使用 vue-plugin-hiprint 开发初版。 功能点实现 隐藏不需要的参数 js复制代码// 配置参数 hiprint.setConfig({ text: { tabs: [], // 隐藏tabs分组 supportOptions: [ { name: 'title', hidden...
【vue-plugin-hiprint】[1]默认分支是npm包及demo的融合代码;对于部分新手来说有点难以下手。本篇开始以新的 demo 开始讲述如何开始使用vue-plugin-hiprint。 ❞ demo项目通过create-vue[2]创建。默认 vue3。 如果你有哪些不清楚的,欢迎各位留言反馈。demo链接见文末。 1.安装 npm i vue-plugin-hiprint 引...
vue-plugin-hiprint(基于hiprint 2.5.4) 当时只是为了方便我(并非hiprint原作者)在vue项目中引入使用,所以以此命名。 此插件仅仅是一个JavaScript【工具库】而非 Vue【组件库】,所以它默认是不包含demo中所见的那些组件页面的(demo代码随便复制修改拿去用)。
源码链接:https://github.com/CcSimple/vue-plugin-hiprint-start 效果如下: 1.前言 首先我们应该清楚两种打印模式: 拖拽生成的html,创建iframe然后调用浏览器提供的printAPI 将生成的html,通过socket.io发送到直接打印客户端再调用electron提供的printAPI
vue-plugin-hiprint (基于hiprint 2.5.4) 当时只是为了方便我(并非hiprint原作者)在vue项目中引入使用,所以以此命名。 此插件仅仅是一个JavaScript【工具库】而非Vue【组件库】,所以它默认不包含demo中的那些组件页面(demo代码可复制使用)。 由于hiprint官网最后一次更新时间为2019年【hiprint 2.5.4 是LGPL协议】,后...
实现无预览打印的Vue2项目中，产品需求不支持浏览器直接调用打印机以避免安全风险。在gitee.com/CcSimple/vue-plugin-hiprint和gitee.com/CcSimple/electron-hiprint/releases地址中，提供了解决方案。首先，在项目入口文件index.html中，安装依赖。项目中实现无预览打印需确保打印内容样式设置为行内样式，以...