javascript - printToPDF 不会打印所有 webContent View

Question

我使用下面的代码将 webContents View 保存到 PDF 文件中。

    saveReport() {
        const remote = require('electron').remote;
        const webContents = remote.getCurrentWebContents();

        webContents.printToPDF({
            pageSize: 'A3',
            landscape: false
        }, (err, data) => {
            remote.require('fs')
                .writeFile(TEMP_URL, data);
        });
    },

该 View 是一个报告，里面有很长的内容(见下文)。

我看到的不是完整 View ，而是带有滚动条的单个页面内的部分 View 。下面是生成的 PDF 的屏幕截图，

预期行为

就像真正的浏览器一样，生成的 PDF 应包含所有 View ，如果单个页面无法提供足够的空间，则应生成多个页面。

我认为我的 CSS 可能有问题。

Answer 1

我对当前的项目有类似的要求，并且我注意到，当您使用此 api 时，您可以通过将 css 文件添加到主 html 并将媒体查询设置为打印来自定义 pdf 的呈现方式媒体=“打印”。

仅当您打印某些内容或通过 API 方法 printToPdf() 将其导出为 pdf 时，才会应用此 CSS 样式表。

如果您正在使用一些 ui 工具包，例如 photon 或 bootstrap ，请尝试禁用它，看看是否有帮助。

最后一个提示:尝试使用CSS属性page-break-before:always;

希望这有帮助