使用Print.js打印HTML，里面的图片没有加载出来！！！

Question

let content = document.getElementById('resume')
content.innerHTML =  `
<h1>Print.js Raw HTML Print Test</h1>
<img src="./test-01.jpg" alt="没显示"/>
<p class="blueText">Lorem ipsum dolor sit amet, consectetur adipiscing elit.</p>
<p>sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.</p>`
const style = '@page { margin: 0; padding: 0 } @media print {} '
printJS({
  printable: 'resume',
  type: 'raw-html',
  style: style,
  targetStyles: ['*']
})

问题描述

在vue环境中出现的问题，我把Print.js官方demo下下来尝试 还是不行

问题出现的环境背景及自己尝试过哪些方法

把图片的路径换成base64可以解决，但是这并不是好的方式啊

Answer 1

肯定是图片还没有完全加载完，就执行了打印方法。

isImgLoad: function isImgLoad() {
    var _this2 = this;

    var printImgs = document.getElementsByClassName('printImg');
    for (var i in printImgs) {
        if (printImgs[i].offsetHeight === 0) {
            this.isLoad = false;
            break;
        }
    }
    if (this.isLoad) {
        clearTimeout(t_img);
        this.getPrints();
    } else {
        this.isLoad = true;
        var t_img = setTimeout(function () {
            _this2.isImgLoad();
        }, 500);
    }
},

Answer 2

js中引入图片路径要先定义：
let img=require('./a.img')或者 import img from './a.img'

<img src='${img}'>