vue3中使用js_initPrinter进行PDA扫码终端打印【无标题】

vue3中使用js_initPrinter进行PDA扫码终端打印

前置条件
需要在相应的终端安装它们设备支持的终端浏览器，此浏览器有打印插件所以来的sdk环境，这个对接时候一般都会提供，以及js中还用打印功能的例子都有。但是比较恶心的是，她们提供的例子开发文档比较粗糙，好多东西需要自己摸索。
开发环境及语言：vue3+ts+vite+vant

1、需要在进入页面后初始化js_initPrinter

<script lang="ts">
  import { defineComponent, onMounted } from 'vue'
  export default defineComponent({
    setup() {
      // 申明变量，注意对应的sdk挂载在windows上
      let Printer = window.Android_LcPrinter as any 
      onMounted(() => {
        // 不加try/catch是每次控制台都会爆红，因为项目UI框架用了vant,爆红造成Toast关闭不了，很头疼，现在也没找到为啥会出现这种情况，又遇到切解决掉的，万望指教。
        try {
          Printer?.js_initPrinter()
        } catch {}
      })
      return { 
    }
  })
</script>

2、做完第一步我们就可以在vue项目使用第三方给提供的打印方法来进行打印啦，具体使用如下

const printBarcode = (printData: any) => {
        console.log('print start')
        //打印一维码
        var barcodeparam = {
          text: printData.ppsFinishId,
          height: 120,
          barcodetype: 73
        }
        var mbarcodeparam = JSON.stringify(barcodeparam)
        var lineparam = {
          line: 10
        }
        var textlineparam = {
          line: 1
        }

        // 69码
        var mdmGoodsSign = printData.mdmGoodsSign ? printData.mdmGoodsSign : ''
        var mdmGoods69code = printData.mdmGoods69code ? printData.mdmGoods69code.slice(-4) : ''
        // 特别需要注意的是，如果想要调整打印文字的样式的话，开发文档提供的几个参数都需要设置才会起作用，否则一直没效果
        var param = {
          offset: 10,
          fontSize: 6,
          isBold: true,
          isUnderLine: false,
          text: mdmGoods69code + '  ' + mdmGoodsSign
        }
        var strParam = JSON.stringify(param)

        var ppsFinishNo = printData.ppsFinishNo ? printData.ppsFinishNo : ''

        const productLeader = printData.productLeader === null ? '' : printData.productLeader

        var param3 = {
          text: '箱数:' + printData.ppsFinishPutinBox + '  ' + '组长:' + productLeader + '  ' + '第 ' + ppsFinishNo + ' 托',
          fontSize: 1,
          offset: 20,
          align: 3
        }
        var strParam3 = JSON.stringify(param3)
        // 生产批号
        var param2 = {
          text: '生产批号:' + printData.mocProductorderTimes + '   ' + '打印次数: 1',
          fontSize: 1
        }
        var strParam2 = JSON.stringify(param2)

        var mlineparam = JSON.stringify(lineparam)
        var tlineparam = JSON.stringify(textlineparam)
        var size = {
          fontsize: 1
        }
        var sizeParam = JSON.stringify(size)
        Printer.js_printLine(tlineparam)
        Printer.js_printFontSize(sizeParam)
        Printer.js_printText1(strParam)
        Printer.js_printLine(tlineparam)
        Printer.js_printBarcode(mbarcodeparam)
        Printer.js_printLine(tlineparam)
        Printer.js_printText(strParam3)
        Printer.js_printLine(tlineparam)
        Printer.js_printText(strParam2)
        Printer.js_printLine(mlineparam)
        Printer.js_start()
      }

需要注意的是，如果想要调整打印文字的样式的话，开发文档提供的几个参数都需要设置才会起作用，否则一直没效果

var param = {
   offset: 10,
   fontSize: 6,
   isBold: true,
   isUnderLine: false,
   text: mdmGoods69code + '  ' + mdmGoodsSign
 }
 var strParam = JSON.stringify(param)
 Printer.js_printText1(strParam)

本来感觉能写还挺多的，结果发现也没啥😂😂，就这样吧

遇到的难点有两个：
1、控制总是爆红，加try/catch就好
2、修改文档样式不起作用，把文档中需要的参数都设置上就可以啦。