1. 新建一个js 文件  ， 命名 为 html2canvas.js ,html2canvas 文件和jspdf.min.js 放同一目录下。下载文件已上传啦 

2. 在vue 文件中引入html2canvas.js 文件

<script>import * as html2Canvas from './html2canvas.js'
</script>

3 点击下载，将页面生成pdf页面下载下来，处理分页

<script>export default {methods: {onDownload(row) {this.toPdf = truethis.showModal(row)this.$nextTick(() => {let element = this.$refs.pdfContentlet options = {dpi: window.devicePixelRatio * 2,scale: 1,backgroundColor: '#ffffff',useCORS: true}setTimeout(() => {html2Canvas(element, options).then((canvas) => {let contentWidth = canvas.widthlet contentHeight = canvas.heightlet pageHeight = contentWidth / 595.28 * 841.89let leftHeight = contentHeightlet position = 0let a4Width = 595.28let a4Height = 595.28 / contentWidth * contentHeightlet pageData = canvas.toDataURL('image/jpeg', 1.0);let pdf = new jsPDF('', 'pt', 'a4')if(leftHeight < pageHeight) {pdf.addImage(pageData, 'JPGE', 0, 0, a4Width, a4Height)}else{while(leftHeight > 0) {pdf.addImage(pageData, 'JPGE', 0, position, a4Width, a4Height)leftHeight -= pageHeightposition -= 841.89if(leftHeight > 0) {pdf.addPage()}}}pdf.save('测试第一次' + '视频巡检报告.pdf')})}, 1000)})},}}
</script>