调用方法导出Excel表格 数据重复的问题bug解决方法

昨天用element-ui写表格 做表格的导出数据,遇到了导出的时候excel表格数据重复的bug 在网上找了很多资料,后来求朋友帮忙解决,也是想着自己做个记录 以后再遇到同样的问题,可以直接解决,也是想分享给跟我一样遇到的问题朋友,这个问题和我朋友帮我解决的,也多亏了他的帮助才能解决这个问题 所以自己要记录一下,最后也谢谢我的那位朋友,如果大家遇到同样的问题 也可以借鉴一下!!!

附加代码

  exportExcel() {
      
      let fix = document.querySelector('.el-table__fixed');
      let oHtml1=document.getElementById('table-1').children[1].removeChild(fix)
      let oHtml = oHtml1.outerHTML;
      let excelHtml = `
        <html>
          <head>
            <meta charset='utf-8' />
            <style>
            h3{
               text-align: center;
            }
	            table{
				    min-width: calc(100vw - 290px);
				    /*margin-top: 50px;*/
				    border-collapse: collapse;
				    border-spacing: 0;
				    border: 1px #eee solid;
				    border-radius: 50px;
	 			 }
				table tr{
				    height:50px;
				    border: 1px #eee solid;
				    white-space: nowrap;
				  }
				  table tr th{
				    border: 1px #eee solid;
				    background-color: #E7E6E6;
				  }
          thead tr td{
              background-color: #E7E6E6;
          }
          .td1{
             background-color: #E7E6E6;
          }
          .td2{
            
             background-color: #E7E6E6;
          }
          .td3{
             background-color: #E7E6E6;
          }
          .td4{
            
             background-color: #E7E6E6;
          }
				  table tr td{
				    border: 1px #eee solid;
				    white-space: nowrap;
            
				    padding: 30px 20px;
				    text-align: center;
				  }
	            </style>
	           </head>
	          <body>
             <h3> ${this.dataFrom.yearNum} 年度标题</h3>
	            ${oHtml}
	          </body>
	       </html> `;
      // 生成blob对象
      let excelBlob = new Blob([excelHtml], {
        type: "application/vnd.ms-excel",
      });
      console.log(oHtml1,'oHtml1')
      console.log(oHtml,'oHtml')
      // 创建一个a标签
      let oA = document.createElement("a");
      // 利用URL.createObjectURL()方法为a元素生成blob URL
      oA.href = URL.createObjectURL(excelBlob);
      // 给文件命名
      oA.download = `${this.dataFrom.yearNum}年度评价结果汇算表.xlsx`;
      // 模拟点击
      oA.click();
       document.getElementById('table-1').children[1].appendChild(fix)
    },

  • 1
    点赞
  • 1
    收藏
    觉得还不错? 一键收藏
  • 1
    评论
评论 1
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值