前端vue项目实现批量打印功能

在项目中遇到一个问题需要实现单页打印和批量打印功能，研究了测试了一番解决了，把相关的功能记录下，方便自己以后查阅，本项目vue cli3环境下的，其他的前端框架也是类似的：

一、单页打印

vue-print-nb插件：这是用于打印，简单，快速，方便，轻便的指令包装。
安装：

npm install vue-print-nb --save

在main.js全局引入注册（也可在组件引入）：

import Print from 'vue-print-nb'
Vue.use(Print);

在需要打印的页面元素上加上id值

    
床前明月光
    
疑似地上霜
    
举头望明月
    
低头思故乡

打印

到这里基本功能都实现了，附上参考地址：
https://www.npmjs.com/package/vue-print-nb

一、批量打印

批量打印这里用的其实就是纯js的写法，直接上代码吧：