学室内设计好不好,郑州哪里培训网站建设优化好一点,wordpress分类下文章置顶,可以免费打广告的网站浏览器的print方法直接调用会打印当前页面的所有元素#xff0c;使用iframe可以实现局部打印所需要的模块。
组件printView#xff0c;将传入的信息放入iframe中#xff0c;调用浏览器的打印功能
templatediv classprintiframeidif…浏览器的print方法直接调用会打印当前页面的所有元素使用iframe可以实现局部打印所需要的模块。
组件printView将传入的信息放入iframe中调用浏览器的打印功能
templatediv classprintiframeidiframestyledisplay: none; width: 100%frameborder0/iframe/div
/template
script
export default {name: printView,methods: {setBodyHtml(html) {const document window.documentconst iframe window.frames[0]iframe.document.head.innerHTML document.head.innerHTML // 获取当前文档的头部给iframeiframe.document.body.innerHTML html // 把传过来的html给iframe头部iframe.document.body.style.background #ffflet arr document.getElementsByTagName(tr)let heightNum 0let onePage 800 //第一页的高度for (let i in arr) {heightNum arr[i].offsetHeightif (heightNum onePage) {heightNum arr[i].offsetHeightonePage 1500 //第二页高度}}iframe.window.print()}}
}
/script div v-ifdetail.work_order_id classbefore idprint_info work-order-detail :detaildetail/work-order-detail /div // 打印 const viewRef ref(null) const print () { const html document.getElementById(print_info).innerHTML viewRef.value.setBodyHtml(html) }