vue2控制打印机打印(三)

本篇文章是使用WEB打印控件Lodop进行操作的

该插件不需要npm install下载任何依赖，但是需要购买这个软件，并把项目部署到购买软件时填写的域名下，不然打印页的左右下角会有"本页由【试用版打印控件Lodop6.5.7.9】输出"的水印

废话不多说，上代码

首先到lodop官网下载相关的js文件和技术文档

lodop官网

第一个打包文件里有个LodopFuncs.js文件，这个需要放入到项目里面引入的。本人放在了utils文件里。

import { getLodop } from "@/utils/LodopFuncs"; //导入模块

methods代码

goPrient() {
  var LODOP = getLodop();
  LODOP.PRINT_INIT("打印");//命名打印机任务
  LODOP.SET_PRINTER_INDEX('打印机') //规定选择的打印机
  LODOP.SET_PRINT_PAGESIZE(2, 2100,2970,'')  //规定打印纸的大小
    //其中SET_PRINT_PAGESIZE的第一个参数是1---纵(正)向打印，固定纸张。2---横向打印，固定纸张。3- 
    //--纵(正)向打印，宽度固定，高度按打印内容的高度自适应.0(或其它)----打印方向由操作者自行选择或 
    //按打印机缺省设置
  LODOP.ADD_PRINT_HTM(250, 250, 100, 78,html代码)  //打印的东西
  LODOP.PRINT();  //打印
}

如果打印时需要预览时需要再加上

LODOP.PREVIEW()

需要注意的是定义的LODOP是局部变量，而不是挂在到data里。本人之前也是挂载到data里，结果老是报错，说事件找不到，真是丈二和尚呀！