vue使用xlsx-js-style导出表格

handleExportExcel() {
// 构造数据,这里示例为一个包含三行三列的表格
// 获取表格元素
const table = document.getElementById(‘table1’);
// 定义一个空数组来存储表格数据
let data = [];
// 遍历表格的每一行
for (let i = 0; i < table.rows.length; i++) {
const row = table.rows[i];
const rowData = [];

    // 遍历当前行的每一列
    for (let j = 0; j < row.cells.length; j++) {
      const cell = row.cells[j].innerText;
      rowData.push(cell);
    }

    // 将当前行的数据添加到数组中
    data.push(rowData);
  }
  //添加两个表格之间的距离
  for (let index = 0; index < 4; index++) {
    data.push([]);
  }
  //记录上一个表格的长度
  let twoTitle =data.length
  console.log();
  // 获取表格元素
  const table2 = document.getElementById('table2');
  // 定义一个空数组来存储表格数据
  const data2 = [];
  // 遍历表格的每一行
  for (let i = 0; i < table2.rows.length; i++) {
    const row = table2.rows[i];
    const rowData = [];

    // 遍历当前行的每一列
    for (let j = 0; j < row.cells.length; j++) {
      const cell = row.cells[j].innerText;
      rowData.push(cell);
    }

    // 将当前行的数据添加到数组中
    data.push(rowData);
  }
  console.log(data);
  // 创建workbook
  var workbook = XLSX.utils.book_new();
  // 添加worksheet
  var worksheet = XLSX.utils.aoa_to_sheet(data);
  // 设置每个单元格的样式
  var range = XLSX.utils.decode_range(worksheet['!ref']);
 console.log(range);
  for (var R = range.s.r; R <= range.e.r; ++R) {
    for (var C = range.s.c; C <= range.e.c; ++C) {
    //设置单元格标题粗体
      if (R === 0 || R == twoTitle) {
        if (cell) {
          if (!cell.s) cell.s = {};
          cell.s.font = { bold: true }; // 设置为粗体
        }
      }
      var cell_ref = XLSX.utils.encode_cell({ r: R, c: C });
      var cell = worksheet[cell_ref];
      if (cell) {
        if (!cell.s) cell.s = {};
        cell.s.alignment = { horizontal: 'center', vertical: 'middle' };
      }
    }
  }
  worksheet["!cols"] = [
    {
      wpx: 150,
    }
  ];
  worksheet["!merges"] = [{ s: { r: 0, c: 0 }, e: { r: 0, c: 7 } },{ s: { r: twoTitle, c: 0 }, e: { r: twoTitle, c: 7 } }];
  // 添加worksheet到workbook
  XLSX.utils.book_append_sheet(workbook, worksheet, 'Sheet1');
  // 导出Excel文件
  var wbout = XLSX.write(workbook, { bookType: 'xlsx', type: 'binary' });
  saveAs(new Blob([this.stringToArrayBuffer(wbout)], { type: 'application/octet-stream' }), '数据导出.xlsx');
},
// 将字符转为ArrayBuffer
stringToArrayBuffer(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;
},
  • 8
    点赞
  • 6
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值