vue3使用xlsx库导出el-table数据

1、使用xlsx导出所有列

<el-button size="small" text type="primary" @click="exportToExcel">
          <template #icon>
            <i class="ti-download" title="导出Excel"></i>
          </template>
        </el-button>
const exportTableRef = ref()
const exportToExcel = () => {
  const tableDom = exportTableRef.value?.$el
  if (!tableDom) {
    return
  }
  const wb = XLSX.utils.table_to_book(tableDom)
  XLSX.writeFile(wb, '表格数据.xlsx')
}

2、自定义导出列

function exportExcel() {
  // swal
  //   .fire({
  //     title: '是否要导出单元阀设备列表？',
  //     text: '',
  //     icon: 'warning',
  //     confirmButtonText: '确定',
  //     cancelButtonText: '取消',
  //     showCancelButton: true
  //   })
  //   .then((result) => {
  //     if (result.isConfirmed) {
  let headerArray = [
    '序号',
    '项目名称',
    '维修状态',
    '地理位置',
    '热源计划维修数量(个)',
    '热源实际维修数量(个)',
    '计划维修时间',
    '计划结束时间',
    '实际维修时间',
    '实际结束时间',
    '完成率(%)',
    '方案文件'
  ]
  filteredData.value.forEach((item: any, index: any) => {
    item.index = index + 1
  })
  let data = [headerArray].concat(
    filteredData.value.map((element: any) => {
      let rowData = [
        element.index,
        element.projectName,
        // element.maintenanceStatus,
        element.maintenanceStatus == '0'
          ? '未进行'
          : element.maintenanceStatus == '1'
            ? '进行中'
            : '已完成',
        element.address,
        element.planMaintenanceHeatSource,
        element.actualMaintenanceHeatSource,
        moment(element.planMaintenanceTime).format('YYYY-MM-DD HH:mm'),
        moment(element.planEndTime).format('YYYY-MM-DD HH:mm'),
        moment(element.actualMaintenanceTime).format('YYYY-MM-DD HH:mm'),
        moment(element.actualEndTime).format('YYYY-MM-DD HH:mm'),
        element.completeRate,
        element.planFile == null ? '-' : element.planFile.originalFilename
      ]
      return rowData
    })
  )
  let sheet = excelUtils.json_to_sheet(data, {
    skipHeader: true
  })
  let book = excelUtils.book_new()
  excelUtils.book_append_sheet(book, sheet)
  writeFile(
    book,

    '热源列表_' + moment(new Date()).format('YYYYMMDDHHmmss') + '.xlsx'
  )
  //   }
  // })
}

原文地址：https://blog.csdn.net/weixin_72439307/article/details/142793442

免责声明：本站文章内容转载自网络资源，如本站内容侵犯了原著者的合法权益，可联系本站删除。更多内容请关注自学内容网（zxcms.com）！