Eelement el-table XLSX 固定左右两边淡出excel数据重复问题

最新推荐文章于 2024-04-05 11:42:33 发布

我有一粒花生米

最新推荐文章于 2024-04-05 11:42:33 发布

阅读量218

点赞数

文章标签： vue.js

本文链接：https://blog.csdn.net/weixin_44286765/article/details/115384159

版权

<template>
      <el-form :inline="true">
        <el-button type="primary" @click="exportTable">导出</el-button>
      </el-form>
</template>

<script>
import FileSaver from "file-saver";
import XLSX from "xlsx";
export default {
    
    
  data() {
    return{
      
    }
  },
  created() {




  },
  methods: {
exportTable(){
    // 导出 element el-table   
    			
这是你的table id = out-table
## <el-table id="out-table" :data="userlisttopup" highlight-current-row v-loading="loading" style="width: 100%;">

      **var fix = document.querySelector('.el-table__fixed') //左右固定 这两个都要写要写这两个
          fix = document.querySelector('.el-table__fixed-right')**
   
     
      var wb;
 
     if(fix){
      wb = XLSX.utils.table_to_book(document.querySelector("#out-table").removeChild(fix));
            document.querySelector("#out-table").appendChild(fix);
     }else{
         wb = XLSX.utils.table_to_book(document.querySelector("#out-table"));
     }
        var wbout = XLSX.write(wb, {
            bookType: "xlsx",
            bookSST: true,
            type: "array", 
        });

         try {
              FileSaver.saveAs(
               new Blob([wbout],{
                type: 'application/octet-stream'
                }), 
                'sheetjs.xlsx'
                );
         } catch (e) { 
           if (typeof console !== 'undefined') console.log(e, wbout)
              
              }
         return wbout
        }

  },

};
</script>

<style scoped>
</style>