vue-to-pdf的使用：vue中將div轉換為pdf文件

1.npm i vue-to-pdf --save

 

2.main.js

import vueToPdf from 'vue-to-pdf'; Vue.use(vueToPdf);

 

3.轉化為pdf並下載

　　注意：div中的圖片需要在本地，線上圖片需要轉化為base64格式才能顯示

 mounted() { this.$PDFSave(this.$refs['content'], '我的文件') } 

 

4.轉化為pdf格式的file數據

methods: { onHandle() { var promiseObj = this.$PDFOutput(this.$refs['box']) promiseObj.then((value) => { this.httpRequest(value).then(res=>{ // value:bolburl
                    // res：file文件
 }) }) }, httpRequest(src) { let that = this
            return new Promise((resolve, reject) => { let xhr = new XMLHttpRequest() xhr.open('GET', src, true) xhr.responseType = 'blob' xhr.onload = function (e) { if (this.status == 200) { let myBlob = this.response let files = new window.File( [myBlob], that.objData.prj_no + '.pdf', { type: myBlob.type } ) // myBlob.type 自定義文件名
 resolve(files) } else { reject(false) } } xhr.send() }) }, },