vue打印之图片无法显示

1,009 阅读1分钟

用img标签不能用背景图片,src用base64位表示 printStyle为打印页面的样式

    getBase64(url, callback) {
      var Img = new Image(),dataURL = '';
      Img.src = url + '?v=' + Math.random();
      Img.setAttribute('crossOrigin', 'Anonymous');
      Img.onload = function () {
        var canvas = document.createElement('canvas'),
          width = Img.width,
          height = Img.height;
        canvas.width = width;
        canvas.height = height;
        canvas.getContext('2d').drawImage(Img, 0, 0, width, height);
        dataURL = canvas.toDataURL('png');
        return callback ? callback(dataURL) : null;
      }
    },

    print() {
      let print = this.$refs.print.innerHTML
      let printPart = print + printStyle;
      let newTab = window.open('_blank');
      newTab.document.body.innerHTML = printPart;
      newTab.print();
      newTab.close();
    }