首先我们需要安装相关依赖 npm install vue-plugin-hiprint Or yarn add vue-plugin-hiprint 在使用前需要在项目入口文件index.html中加入(必须) <!--【必须】在index.html 文件中添加打印所需样式(此cdn可能不稳定):--> <!-- 可以调整成 相对链接/自有链接, 【重要】名称需要一致 【print-lock.css】-->...
import{hiprint, defaultElementTypeProvider}from'vue-plugin-hiprint'// 引入后使用示例hiprint.init();// 下列方法都是没有拖拽设计页面的, 相当于代码模式, 使用代码设计页面// 想要实现拖拽设计页面,请往下看 '自定义设计'varhiprintTemplate =newhiprint.PrintTemplate();varpanel = hiprintTemplate.addPrintPanel...
首先,你需要明确hiprint函数在Vue2项目中的具体功能。hiprint是一个用于打印的插件,它可以帮助你在Vue项目中实现各种打印功能,如打印HTML内容、设置纸张大小、调整打印布局等。 2. 在Vue2项目中引入hiprint函数相关的库或文件 在Vue2项目中引入hiprint插件,通常通过npm安装: bash npm install vue-plugin-hiprint 此外...
源码链接: https://github.com/CcSimple/vue-plugin-hiprint-start ▲本篇效果图 1.编写 provider 并 构建 这里将创建两个provider文件,用于演示如何在两个不同容器中去构建可拖拽元素。 1.1 创建 provider 首先创建provider,直接上代码: // provider1.jsimport { hiprint } from "vue-plugin-hiprint";export...
❝【vue-plugin-hiprint】[1]默认分支是npm包及demo的融合代码;对于部分新手来说有点难以下手。本篇开始以新的demo开始讲述如何开始使用vue-plugin-hiprint。❞
实现无预览打印的Vue2项目中，产品需求不支持浏览器直接调用打印机以避免安全风险。在gitee.com/CcSimple/vue-plugin-hiprint和gitee.com/CcSimple/electron-hiprint/releases地址中，提供了解决方案。首先，在项目入口文件index.html中，安装依赖。项目中实现无预览打印需确保打印内容样式设置为行内样式，以...
hiprint.setConfig({ text: { tabs:[] } }) 注意:如果当面板已有元素,那么设置后会使用缓存的参数配置。 此时新拖入一个text元素再次点击它查看就可以了。 2.隐藏/显示/调整 参数 每个参数都是由name和hidden组成的对象,每当点击元素去渲染参数的时候都是依次渲染的;所以排序和隐藏/显示各个参数也就很容易配置...
1、安装插件: npm install vue-plugin-hiprint 或 yarn add vue-plugin-hiprint 2、普通使用: <template> <div class="box"> <div class="bo
源码链接:https://github.com/CcSimple/vue-plugin-hiprint-start 1.编写 provider 并 构建 这里将创建两个provider文件,用于演示如何在两个不同容器中去构建可拖拽元素。 1.1 创建 provider 首先创建provider,直接上代码: // provider1.js import { hiprint } from "vue-plugin-hiprint"; ...
hiprint for Vue2.x / Vue3.x (基于 jQuery, 理论上其他框架可用。react demo 分支) jQuery/uniapp (html/h5) 项目 见下方 jQuery/uniapp 项目使用 Important 注意事项 NodeJs 需要 16.x 版本 (开发使用 16.18.1) 【vue-plugin-hiprint】与【hiprint.io官网】差异甚多,请忽混用!请忽混用!请忽混用! 请...