我是在react项目中测试。 正常npm安装printjs
npm install print-js --save
然后选中页面里面一个元素打印,发现用的antd样式丢失,这还真不知道如何在打印的时候把antd样式引入。
import printJS from "print-js";
printJS({printable: "id", type: 'html',style: '@page { size: auto; margin: 0mm; }'})
退而求其次,将元素生成图片再打印。 先安装**html-to-image**
npm install --save html-to-image
然后先html转换图片,然后打印
//引入htmlToImage
import * as htmlToImage from 'html-to-image';
//引入printjs
import printJS from "print-js";
htmlToImage.toPng(printContentRef.current)
//这里的dataUrl是base64的图片数据
.then(function (dataUrl) {
printJS({printable: dataUrl, type: 'image',style: '@page { size: auto; margin: 0mm; }'})
})
.catch(function (error) {
console.error('oops, something went wrong!', error);
});
思考,如果遇到分页的该怎么办呢