zoukankan      html  css  js  c++  java
  • 适用于vue项目的打印插件

    此方法只适用于现代浏览器,IE10以下就别用了

    // 使用时请尽量在nickTick中调用此方法
    //打印
    export default (refs, cb) => {
        let cloneN
        if (Array.isArray(refs)) {
            cloneN = refs[0].cloneNode(true)
        } else {
            cloneN = refs.cloneNode(true)
        }
        const body = document.getElementsByTagName('body')[0]
        cloneN.style.position = 'absolute'
        cloneN.style.zIndex = '9999999999'
        cloneN.style.top = 0
        cloneN.style.left = 0
        cloneN.style.width = '100%'
        cloneN.style.minHeight = '100%'
        cloneN.style.background = '#fff'
        body.appendChild(cloneN)
    
        // 配置样式
        const bt = body.style.cssText
        body.style.overflowY = 'auto'
        body.style.cloneN = 'auto'
        const eld = document.querySelector('.el-dialog__wrapper')
        const dc = eld.style.cssText
        eld.style.display = 'none'
        // 图片全部加载完成后再开始打印
        let imgs = cloneN.getElementsByTagName('img')
        let len = imgs.length
        let ni = 0
    
        const print = () => {
            ni += 1
            if (ni === len) {
                // 开始打印
                window.print()
                // 还原样式
                body.style = bt
                eld.style = dc
                // 移除节点
                body.removeChild(cloneN)
                // 回调
                if (cb) {
                    cb()
                }
            }
        }
    
        for (let i of imgs) {
            i.onload = () => {
                print()
            }
            i.onerror = () => {
                print()
            }
        }
    }
    
    
  • 相关阅读:
    哈密顿绕行世界问题 (dfs)
    山东省第八届ACM大学生程序设计竞赛
    HDU
    HDU
    hdu 1241(DFS/BFS)
    centos7 df 命令卡死
    hosts文件修改之后立刻刷新
    shell脚本打印日期时间
    CentOS6设置php-fpm开机自启动
    Word中怎么设置忽略拼写和语法检查提醒
  • 原文地址:https://www.cnblogs.com/lvyueyang/p/9847813.html
Copyright © 2011-2022 走看看