英文:
NPM react-to-print fails to render text
问题
我正在为我的网站添加打印当前页面的支持。我的网站是使用React Js构建的。我正在使用"react-to-print"，这是一个NPM模块，用于打印当前页面。我正在按照这个页面上的说明操作。我注意到一个间歇性的问题，即文字未被打印。看起来像这样：
这是我调用React-to-print UI组件的方式：
<ReactToPrint
documentTitle={title || ''}
content={onPrint}
onAfterPrint={onAfterPrint}
onBeforeGetContent={onBeforePrint}
removeAfterPrint
copyStyles
trigger={() => (
<div className="pdf-button">
<div className="pdf-trigger">
<PictureAsPdfOutlined />
<div className="text">PDF Download</div>
</div>
</div>
)}
/>
我尝试删除"removeAfterPrint"属性以及许多不成功的调用。是否存在一些与这个库有关的问题，导致React UI组件无法正确渲染？
英文:
I am adding support to my website for printing the current page. My website is built with React Js. I am using 'react-to-print', a NPM module, to print the current page. I am following instructions from this page. I am observing an intermittent issue where the text is not printed. Looks like this:
Here is my invocation of the React-to-print UI component:
<ReactToPrint
documentTitle={title || ''}
content={onPrint}
onAfterPrint={onAfterPrint}
onBeforeGetContent={onBeforePrint}
removeAfterPrint
copyStyles
trigger={() => (
<div className="pdf-button">
<div className="pdf-trigger">
<PictureAsPdfOutlined />
<div className="text">PDF Download</div>
</div>
</div>
)}
/>
I have tried removing the 'removeAfterPrint' property and many various invocations with no luck. Is there some issue with this library preventing the correct rendering of React UI components?
答案1
得分: 1
通过移除应用程序中使用的自定义字体的重复 @font-face 定义来解决了此问题。不确定究竟是什么导致了问题，但我观察到，当我从控制台调用 window.print() 时，也发生了这个问题。这个问题与 react-to-print 库无关。
英文:
Solved this issue by removing duplicate @font-face definitions for a custom font used within my application. Not sure "what" exactly was breaking; I did observe, however, that this issue was also occurring when I called window.print() from the console. The issue was not related to the react-to-print library.
通过集体智慧和协作来改善编程学习和解决问题的方式。致力于成为全球开发者共同参与的知识库，让每个人都能够通过互相帮助和分享经验来进步。
评论