最近的项目需要调用打印机,把网上的一些资料整理一些,分享给大家,需要注意的是lodop会有脚标,如果想去掉脚标,只能先预览再打印,或者购买版权。
lodop官网vue案例地址:点击进入
在这里插入图片描述
安装打印机驱动,设置打印尺寸这里就先不分享了。直接上代码

1、下载LodopFuncs.js文件,把js放在常用的js文件夹中

2 、修改LodopFuncs.js文件

//在文件最底部添加一行代码,把该文件中的getLodop函数 export 出来。
export { getLodop };

3、js调用打印机

import { getLodop } from "@/assets/js/LodopFuncs"; //从自己的项目中引入第一步存放的LodopFuncs.js

methods: {
//打印快递单
 btnClickPrint() {
    LODOP = getLodop(); //调用getLodop获取LODOP对象
    LODOP.PRINT_INIT("打印控件功能演示_Lodop功能_整页缩放打印输出");
    LODOP.ADD_PRINT_IMAGE(
      0,
      0,
      395,
      810,
      "<img style='-webkit-user-select: none;margin: auto;cursor: zoom-in;' src='" +
        data +
        "' />"		//data需要打印的东西
    );
    LODOP.SET_PRINT_STYLEA(0, "Stretch", 1); //(可变形)扩展缩放模式
    LODOP.PREVIEW(); //预览(预览打印无脚标)
    // LODOP.PRINT();  //打印
 },
}

大功告成

Logo

前往低代码交流专区

更多推荐