代码中如何优化window.print()谷歌浏览器卡顿现象如何解决

如果你的代码中使用了 `window.print()` 方法，并且在谷歌浏览器下出现了卡顿现象，你可以考虑以下几个优化方法：

1. 提前加载 PDF 数据流

在调用 `window.print()` 方法之前，你可以提前加载 PDF 数据流。这样可以避免在打印时出现卡顿，因为 PDF 数据流已经被加载到浏览器中了。你可以使用类似于以下的代码来实现：

// 提前加载 PDF 数据流
axios.get('/downloadPdf', { responseType: 'blob' })
    .then(response => {
        const blob = new Blob([response.data], { type: 'application/pdf' });
        const url = URL.createObjectURL(blob);
        window.pdfUrl = url;
    })
    .catch(error => {
        console.error(error);
    });

// 在调用 window.print() 方法时使用提前加载的 PDF 数据流
if (window.pdfUrl) {
    const iframe = document.createElement('iframe');
    iframe.style.display = 'none';
    iframe.src = window.pdfUrl;
    document.body.appendChild(iframe);
    iframe.contentWindow.print();
} else {
    console.error('PDF 数据流未加载');
}

这段代码会在页面加载时提前加载 PDF 数据流，并将其保存在 `window.pdfUrl` 变量中。然后，在调用 `window.print()` 方法时，它会使用已经加载的 PDF 数据流来打印。

2. 避免重复打印

如果你的代码中可能会重复调用 `window.print()` 方法，你可以考虑使用一个标志位来避免重复打印。具体来说，你可以在第一次打印时设置一个标志位，在后续的打印操作中检查标志位是否已经被设置，如果已经设置，则不再重复打印。

let isPrinting = false;

function printPdf() {
    if (isPrinting) {
        console.warn('正在打印中');
        return;
    }
    isPrinting = true;

    const iframe = document.createElement('iframe');
    iframe.style.display = 'none';
    iframe.src = '/downloadPdf';
    document.body.appendChild(iframe);

    iframe.contentWindow.onload = () => {
        iframe.contentWindow.print();
        isPrinting = false;
    };
}

这段代码会在第一次打印时设置 `isPrinting` 标志位，然后在后续的打印操作中检查标志位是否已经被设置。如果已经被设置，则不再重复打印。

希望以上方法可以帮助你优化谷歌浏览器下的 `window.print()` 方法。