当前位置:   article > 正文

vue3+element plus 前端使用print-js实现打印功能_elementplus 生成打印

elementplus 生成打印

print-js官网链接:

  • https://printjs.crabbly.com/

大佬的详细教程:

  • https://www.cnblogs.com/lemoncool/p/14210465.html
  • https://blog.csdn.net/qq_42571665/article/details/127277049

安装依赖

npm install print-js --save
  • 1

使用

在需要打印的HTML部分,使用id包裹起来

<button  @click="openPrint()">点击打印</button>
<div id="printContent">
	<el-table> ......</el-table>
</div>
  • 1
  • 2
  • 3
  • 4

在js中先引入,然后定义方法
直接在.vue文件中引入就可

  import printJS from 'print-js'
  • 1
function openPrint(){
      printJS({
        printable: 'printContent',
        type: 'html',
        targetStyles: ['*']
      })
}
  • 1
  • 2
  • 3
  • 4
  • 5
  • 6
  • 7
声明:本文内容由网友自发贡献,不代表【wpsshop博客】立场,版权归原作者所有,本站不承担相应法律责任。如您发现有侵权的内容,请联系我们。转载请注明出处:https://www.wpsshop.cn/w/weixin_40725706/article/detail/105165
推荐阅读
相关标签
  

闽ICP备14008679号