vue 实现Excel导出文件，设置单元格样式，居中，靠右，边框等，并设置数据类型货币类型， 使用xlsx，xlsx-style插件实现

1、下载插件 xlsx xlsx-style

npm install --save xlsx xlsx-style

2、进行数据导出

根据 自己业务更改表格样式及导出数据类型

import XLSX from 'xlsx'
import * as XLSXStyle from 'xlsx-style';
export default {
  s2ab(s) {
    var buf = new ArrayBuffer(s.length);
    var view = new Uint8Array(buf);
    for (var i = 0; i != s.length; ++i) view[i] = s.charCodeAt(i) & 0xFF;
    return buf;
  },


  exportToExcel(idSelector, fileName) {
    
    const xlsxParam = { raw: true }
    let table = document.querySelector(idSelector).cloneNode(true);

    
    if (table.querySelector('.el-table__fixed-right'))
      table.removeChild(table.querySelector('.el-table__fixed-right'));
    if (table.querySelector('.el-table__fixed'))
      table.removeChild(table.querySelector('.el-table__fixed'));

    const wb = XLSX.utils.table_to_book(table, xlsxParam)
    let range = XLSX.utils.decode_range(wb.Sheets['Sheet1']['!ref']);
    let cWidth = [];
    for (let C = range.s.c; C  range.e.c; ++C) {   
      let len = 100; 
      let len_max = 400; 
      for (let R = range.s.r; R  range.e.r; ++R) {  
        let cell = { c: C, r: R };             
        let cell_ref = XLSX.utils.encode_cell(cell);  
        if (wb.Sheets['Sheet1'][cell_ref]) {
        
          if (cell.c > 3 && cell.r > 1) {
          	
            wb.Sheets['Sheet1'][cell_ref].t = 'n' 
            
            wb.Sheets['Sheet1'][cell_ref].s = { 
              alignment: {
                horizontal: 'right',
                vertical: 'center',
              },
              border: {
                top: { style: 'thin' },
                bottom: { style: 'thin' },
                left: { style: 'thin' },
                right: { style: 'thin' }
              }
            };
            
          } else {
            wb.Sheets['Sheet1'][cell_ref].s = {
              alignment: {
                horizontal: 'center',
                vertical: 'center',
              },
              border: {
                top: { style: 'thin' },
                bottom: { style: 'thin' },
                left: { style: 'thin' },
                right: { style: 'thin' }
              }
            };
          }
          
          if (wb.Sheets['Sheet1'][cell_ref].t === 'n') {
          	
            if(typeof wb.Sheets['Sheet1'][cell_ref].v === 'string'){
              
              wb.Sheets['Sheet1'][cell_ref].v = wb.Sheets['Sheet1'][cell_ref].v.replace(/,/g,"")
              let value = parseFloat(wb.Sheets['Sheet1'][cell_ref].v);
              if (!isNaN(value)) {
                wb.Sheets['Sheet1'][cell_ref].z = '#,##0.00'; 
              }
            }
          }
          
          let va = JSON.parse(JSON.stringify(wb.Sheets['Sheet1'][cell_ref].v));
          var card1 = JSON.parse(JSON.stringify(va)).match(/[u4e00-u9fa5]/g); 
          var card11 = "";
          if (card1) {
            card11 = card1.join("")
          }
          var card2 = JSON.parse(JSON.stringify(va)).replace(/([^u0000-u00FF])/g, "");  
          let st = 0;
          if (card11) {
            st += card11.length * 20  
          }
          if (card2) {
            st += card2.length * 10  
          }
          if (st > len) {
            len = st;
          }
        }
      }
      if (len > len_max) {
        len = len_max;
      }

      cWidth.push({ 'wpx': len });     
    }
    wb.Sheets['Sheet1']['!cols'] = cWidth
    
    const wbout = XLSXStyle.write(wb, { bookType: 'xlsx', bookSST: false, type: 'binary' })
    try {
      saveAs(new Blob([this.s2ab(wbout)], { type: 'application/octet-stream' }), `${fileName}.xlsx`)
      
    } catch (e) {
      if (typeof console !== 'undefined') {
        console.log(e, wbout)
      }
    }
    return wbout
  }
 }

3、使用函数

 !-- #'#out-table' 为 id，后面的参数为导出报表的名称 -->
el-button type="warning" @click="$exportFn.exportToExcel('#out-table',' 联营租赁营业款日报表 ')" size="small"> 导出 /el-button>

script>
import XLSX from 'xlsx';
import $exportFn from '@/components/exportFn'
/script>