欢迎关注我的公众号

《人生代码》

我有一个大胆的想法，我要一直写到死，那一天我不写了，可能就死了。哈哈。

哈喽，大家好，我是你们的攻城狮，人贱人爱的 Ken，一个永远充满激情的人。

最近接收到一个优化需求：就是对之前的行程文档的图文介绍添加打印生成 pdf 的功能

当然，我们需要依赖 html2canvas 和 jspdf.min.js 这两个库，html2canvas 是用于生成 canvas，jspdf.min.js 是用于生成 pdf 的。

首先我们需要引入 html2canvas, jspdf

   

    

     

      

     
     

      

       import html2canvas from 
       'html2canvas'
      
     
    

     

      

     
     

      

       import 
       './jspdf.min.js'
      
     
   

如果有滚动条，先把滚动条置顶

   

    

     

      

     
     

      

       document.body.scrollTop = document.documentElement.scrollTop = 
       0
      
     
    

     

      

     
     

      

       if (!selector) {
      
     
    

     

      

     
     

      

           throw 
       new Error(
       '缺少selector')
      
     
    

     

      

     
     

      

       }
      
     
    

     

      

     
     

      

       let el = document.querySelector(selector)
      
     
    

     

      

     
     

      

       if (!el) {
      
     
    

     

      

     
     

      

           throw 
       new Error(
       '未找到' + selector + 
       '对应的dom节点')
      
     
    

     

      

     
     

      

       }
      
     
   

设置背景色为白色，然后转成图片后，获取截断处图片像素点，从截断处往上一行行扫描像素点颜色，碰到这一行颜色都是