jsPDF 不显示来自图像 url 的图像

时间:2021-01-27 08:50:01

标签: javascript reactjs pdf jspdf

我正在使用以下函数在我的项目中将按钮单击时的 div 下载为 pdf。

function printDocument() {
    htmlToImage.toPng(document.getElementById('divToPrint'), { quality: 0.95 })
        .then(function (dataUrl) {
            const link = document.createElement('a');
            link.download = 'my-image-name.jpeg';
            const pdf = new jsPDF();
            const imgProps= pdf.getImageProperties(dataUrl);
            const pdfWidth = pdf.internal.pageSize.getWidth();
            const pdfHeight = (imgProps.height * pdfWidth) / imgProps.width;
            pdf.addImage(dataUrl, 'PNG', 0, 0,pdfWidth, pdfHeight);
            pdf.save("download.pdf");
        });
}

以下是我正在下载的表格

 <table className={classes.cart}>
                                <thead>
                                <tr>
                                    <th>Quantity</th>
                                    <th>StockID</th>
                                    <th>Description</th>
                                    <th>Price</th>
                                    <th>Total</th>
                                </tr>
                                </thead>
                                <tbody>
                                cartItems.map(item =>
                <tr>
                    <td>{item.quantity}</td>
                    <td>{item.product.sku}</td>
                    <td>{item.product.name}</td>
                    <td>{item.prices.price.value}</td>
                    <td>{item.prices.price.value*item.quantity}</td>
                </tr>
                               <tr>
        <th colSpan={'4'}>Cart Total</th>
        <td>{flatData.subtotal.value}</td>
    </tr> 
                                </tbody>
                            </table>

数据是从后端传到表里设置的

<td><img src={item.product.img_url}/></td>

图像没有显示在下载的 pdf 中。但是如果我使用存储在我的项目文件夹中的图像,它会显示在下载的 pdf 中。请帮助

0 个答案:

没有答案