前端项目Excel数据导出同时出现中英文表头错乱情况解决方案。

文章目录

• 前言
• 一、Excel导出出现中英文情况。
• 二、解决方案
• • 数据处理
• 三、效果展示
• 总结

---

前言

在前端项目中实现Excel导出功能时，数据导出excel是常见的业务需求。但excel导出完表头同时包含了中文和英文的bug，下面是我的经验分享，应该可以帮助到你。

---

一、Excel导出出现中英文情况。

明明设置了中文表头，为啥还会出现这种情况呢？

问题所在，我们看到我的表头同时包含了中文英文，所以会导致同时出现。

二、解决方案

数据处理

把我们的选择的数据进行中文转换。

const exportExcel = () => {
    console.log(selectRows);

    const res = selectRows.map((item): IExportExcel => {
      return {
        账单号: item.accountNo,
        缴费状态: item.status === "1" ? "已缴费" : "未缴费",
        房屋号: item.roomNo,
        车位号: item.carNo,
        手机号: item.tel,
        "物业费(年)": item.costName1,
        车位费: item.costName2,
        房屋租金: item.costName3,
        开始时间: item.startDate,
        结束时间: item.endDate,
        优惠金额: item.preferential,
        合计应收金额: item.money,
        支付方式: item.pay,
      };
    });
    console.log(res);

    _exportExcel<IExportExcel>(res, header);
  };

从上面处理成下面

这样表头就只会出现中文了。

三、效果展示

这样就导出的是中文了。

总结

以上就是Excel导出出现的中英文表头解决方案，只是经验分享，如果有小伙伴遇到同样的情况，可以不妨试一试。感谢支持！！！