html2canvas 和浏览器打印

标签：ima   div   taint   load   代码   lob   全局   win   down   

vue-print-nb
html2canvas

 handlePrint(el) {
                let htmlDom = document.getElementById(el)

                const loading = this.$loading({
                    lock: true,
                    customClass: ‘canvas-loading‘,
                    text: ‘正在处理...‘,
                    spinner: ‘el-icon-loading‘,
                    background: ‘rgba(0, 0, 0, 0.9)‘
                });

                window.scrollTo(0, 0)

                html2canvas(htmlDom, {
                    allowTaint: false,   //允许污染
                    taintTest: true,    //在渲染前测试图片(没整明白有啥用)
                    useCORS: true,      //使用跨域(当allowTaint为true时这段代码没什么用,下面解释)
                    background: "#1E233F",
                }).then(canvas => {
                    this.printImgSrc = canvas.toDataURL(‘image/png‘, 1.0)

                    setTimeout(function () {
                        loading.close()

                        let div = document.getElementById(‘printImgContainer‘)
                        div.click()
                    }, 500);
                })
            },

            // 打印
            testPrint() {
                this.downloadFlag = 1;
                this.$global.print_page();

                setTimeout(() => {
                    this.downloadFlag = 0;
                }, 1000)
            },

html2canvas 和浏览器打印

标签：ima   div   taint   load   代码   lob   全局   win   down   

原文地址：https://www.cnblogs.com/Grani/p/13377163.html