浏览器打印特定元素的方法

<!-- 
适用于VUE项目
需要导入print.JS和html2canvas
 -->
    <div id="printTable" ref="printTable">
		任意内容
	</div>
	<button @click='print'>打印<button>

    // 打印物品
    print() {
      var t = window.devicePixelRatio   // 获取下载的缩放 125% -> 1.25    150% -> 1.5
      if (t != 1) {   // 如果进行了缩放，也就是不是1
        document.body.style.zoom = -0.6 * t + 1.55;   // 就去修改页面的缩放比例，这个公式我自己算的，不准确，勉强。
      }
      const printContent = this.$refs.printTable;
      const width = printContent.clientWidth;
      const height = printContent.clientHeight;
      const canvas = document.createElement('canvas');
      const scale = 4;
      canvas.width = width * scale; // 定义canvas 宽度 * 缩放
      canvas.height = height * scale; // 定义canvas高度 *缩放
      canvas.style.width = width * scale + 'px';
      canvas.style.height = height * scale + 'px';
      canvas.getContext('2d').scale(scale, scale);
      const scrollTop = document.documentElement.scrollTop || document.body.scrollTop; // 获取滚动轴滚动的长度
      const scrollLeft = document.documentElement.scrollLeft || document.body.scrollLeft;
      this.printerLoading = true
      html2canvas(printContent, {
        canvas,
        backgroundColor: null,
        useCORS: true,
        windowHeight: document.body.scrollHeight,
        scrollX: -scrollLeft, // 解决水平偏移问题，防止打印的内容不全
        scrollY: -scrollTop
      }).then((canvas) => {
        this.printerLoading = false
        const url = canvas.toDataURL('image/png')
        printJS({
          printable: url,
          type: 'image',
          documentTitle: '', // 标题
          style: '@media print{@page {size:landscape;margin: 0cm 1cm 0cm 1cm;border:5px #f80 solid;}}'
        })
      }).catch(err => {
        this.printerLoading = false
        console.error(err);
      })
    },