vue结合vue-print-nb实现页面打印功能
【vue结合vue-print-nb实现页面打印功能】安装在main.js中全局引入页面中使用安装npm install vue-print-nb --save1在main.js中全局引入import Print from 'vue-print-nb'Vue.use(Print);12外汇赠金活动页面中使用备注:只会打印id=printMe内的网页打印模板XXXX {{ list.fromName }} XXXX {{ list.fromIdCard }} XXXX {{ list.fromPhone }}XXXX {{ list.fromName }}{{ list.fromIdCard }} XXXX {{ list.fromPhone }}XXXX {{ list.reason }} XXXX {{ list.reason }}XXXX {{ list.reason }}XXXX {{ list.reason }}XXXX
文章图片
/>XXXX
文章图片
/>打印.table { width: 100%; height: 100vh; overflow-y: scroll;}.tableList { width: 900px; margin: auto; margin-top: 20px;}.title { font-size: 20px; width: 100%; text-align: center;}.table-name-three,.table-info-three { border: 0.55px solid; width: 16.7%;}.table-name-two,.table-info-two { border: 0.55px solid; width: 25%; line-height: 100px; text-align: center;}.table-info-img { border: 0.55px solid; width: 75%;}.table-info-one { border: 0.55px solid; width: 75%;}.table-name-one { border: 0.55px solid; width: 25%;}.content-table-one,.content-table-two,.content-table-three { display: flex; height: 100px; width: 100%; line-height: 100px; text-align: center;}.content-table-img { display: flex; height: 100px; width: 100%; line-height: 100px; text-align: center;}img { max-width: 100%; height: 100%; background-size: 100%; background-repeat: no-repeat;}.imgsrc { width: 90%; margin: auto; height: 90%; margin-top: 5px;}.table-btn { margin-top: 20px; display: flex; justify-content: space-evenly; align-items: center; align-content: center;}
- 无人|无人维护?官方打脸:Element UI for Vue 3.0 来了!
- 教程 | VUE视频编辑软件会员功能 获取
- 从零搭建vue + jenkins 超详细教程
- 分布式锁结合SpringCache
- Vue实战091:Vue项目部署到nginx服务器
- 共识|将PoA和PoS共识机制结合 UMI如何防止集中化风险?
- Django实战017:django+vue+redis项目
- vue2.x与vue3.x语法对比浅析
- 三星s系列一直是设计和硬件结合的天花板,颜值这一块没有对手
- 5G结合边缘运算催生电信云 支持随选消费模式