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
vue结合vue-print-nb实现页面打印功能
文章图片
/>XXXX
vue结合vue-print-nb实现页面打印功能
文章图片
/>打印.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;}