前端vue2实现打印功能

在Vue.js 2中实现打印功能通常涉及到将HTML内容导出为PDF，然后通过浏览器的原生打印API进行打印。这里有一个简单的步骤说明：

1. **安装依赖**：首先需要安装一个叫做`html2canvas`的库，它可以把网页内容转换成图片，然后再转成PDF。你可以使用npm来安装：

   npm install html2canvas jsPDF --save-dev

2. **引入库**：在Vue组件中引入这两个库，并导入它们的实例：

   import html2Canvas from 'html2canvas';
   import jsPDF from 'jspdf';

3. **创建方法**：创建一个方法，比如`printToPdf`，用于生成PDF并触发打印：

   async printToPdf() {
     // 将当前页面转换为canvas元素
     let canvas = await html2Canvas(document.querySelector('#your-print-target'), {useCORS: true});

     // 创建一个新的jsPDF文档
     let doc = new jsPDF('p', 'mm', 'a4');

     // 将canvas的内容添加到pdf中
     doc.addImage(canvas.toDataURL('image/png'), 'PNG', 0, 0, 210, 297);

     // 打印PDF
     doc.save('your_pdf_file_name.pdf');
     // 或者直接打印
     window.open(doc.output('bloburl'));
   }

确保替换`#your-print-target`为你想要打印的页面元素ID。

4. **绑定事件**：最后，在Vue组件的模板上绑一个点击按钮或者其他触发事件，调用`printToPdf`方法：

   <button @click="printToPdf">打印</button>