vue打印echarts

思路
將整個body的內容替換爲彈窗的內容，打印操作完成之後還原
echarts打印時未顯示，通過將其轉爲img的方法進行打印

 //打印觸發的方法
    print() {
      var that = this;
      var oldstr = document.body.innerHTML; // 獲取當前頁面內容用以還原
      var div_print = document.getElementById("printTest"); // 獲取要打印部分的內容
      var cv = document.getElementsByTagName("canvas")[0]; //獲取canvas
      var resImg = document.getElementsByClassName("resImg")[0]; //獲取包裹canvas的標籤
      // 將canvas轉爲圖片
      var context = cv.getContext("2d");
      var img = new Image();
      var strDataURI = cv.toDataURL("image/png");
      img.src = strDataURI;
      // 圖片加載完成之後
      img.onload = function() {
        // 執行打印
        console.log(img);
        setTimeout(function() {
          resImg.innerHTML = `<img src="${strDataURI}">`; // 用圖片替代canvas
          var newstr = div_print.innerHTML;
          document.body.innerHTML = newstr; // 將頁面內容改爲修改後的內容
          window.print(); // 打印
          window.location.reload(); // 重新加載頁面
          document.body.innerHTML = oldstr; // 將頁面內容還原
        }, 1000);
      };
    },