Excel单元格内容换行设置后打开仍显示一行?

下载.xlsx的文件,设置了单元格内容换行,但是为什么打开的时候展示的单元格内容是一横行展示的?(ps:复制单元格内容就是,粘贴的格式就是正确的换行格式,双击单元格也会进行换行,但是为什么默认打开展示的是一横行呢,我就想实现一打开就是换行之后的格式)

 async handleExport() {
            const workbook = new ExcelJS.Workbook();
            const worksheet = workbook.addWorksheet('Sheet1');

            // 添加表头
            const headerRow = this.titleName.map(item => item.labelName);
            worksheet.addRow(headerRow);

            // const headerRowStyle = worksheet.addRow(headerRow); 
            // 设置表头样式(背景色)
            // headerRowStyle.eachCell((cell) => {
            //     cell.fill = {
            //         type: 'pattern',
            //         pattern: 'solid',
            //         fgColor: { argb: 'f5f7fa' } ,
            //     };
            // });

            // 设置表头样式(加粗、字号)
            // headerRowStyle.font = { bold: true, size: 16};

            // 将数据添加到工作表
            this.tableData.forEach(row => {
                const rowData = this.titleName.map(item => {
                    if (row[item.val].values.type === 'text') {
                        return row[item.val].values.kpi_name;
                    } else {
                        const data = [
                            "类型:指标",
                            "数据来源:" + (row[item.val].values.dataSource.indexOf("报表") !== -1 ? "掌上经分-报表(同经分前台-报表中心)" : (row[item.val].values.dataSource.indexOf("网页经分") !== -1 ? "网页经分" : "掌上经分-指标(同经分前台-关键指标)")),
                            "指标ID:" + row[item.val].values.kpi_id,
                            "指标名称:" + row[item.val].values.kpiCascaderName,
                            "指标单位:" + row[item.val].values.kpi_unit,
                            "指标路径:" + row[item.val].values.kpiRoute,
                            "数据动态时间:" + (row[item.val].values.TIME_INTERVAL == Number(row[item.val].values.TIME_INTERVAL) ? (row[item.val].values.NUM_VAL ? row[item.val].values.NUM_VAL + '天前' : '') : (row[item.val].values.TIME_INTERVAL && row[item.val].values.TIME_INTERVAL !== "undefined") ? row[item.val].values.TIME_INTERVAL : '').replace(/,/g, ''),
                            "数据固定时间:"+ row[item.val].values.kpi_time,
                            "数据区域:"+row[item.val].values.info,
                            "取值逻辑:"+row[item.val].values.valueLogicRes,
                            // 其他字段依次类推
                        ].join("\n");
                        return data
                    }
                });
                worksheet.addRow(rowData);
            });

              // 设置换行
            worksheet.eachRow({ includeEmpty: true }, (row, rowNumber) => {
                console.log(row);
                row.eachCell({ includeEmpty: true }, (cell) => {
                cell.alignment = { wrapText: true };
                });
            });

            // 设置列宽
            worksheet.columns.forEach((column, index) => {
                column.width = 40; // 设置列宽为 40
                column.eachCell({ includeEmpty: true }, (cell) => {
                    cell.alignment = { horizontal: 'left', vertical: 'middle' };
                });
            });

            this.titleName.forEach((item, index) => {
                if (item.format === 'wrapText') {
                    worksheet.getColumn(index + 1).eachCell({ includeEmpty: true }, (cell) => {
                        cell.alignment = { wrapText: true };
                    });
                }
            });
            
            // 生成 Excel 文件
            const buffer = await workbook.xlsx.writeBuffer();
            const blob = new Blob([buffer], { type: 'application/vnd.openxmlformats-officedocument.spreadsheetml.sheet' });
            const url = window.URL.createObjectURL(blob);

            // 创建链接并下载文件
            const link = document.createElement('a');
            link.href = url;
            link.download = this.tableName + '.xlsx';
            document.body.appendChild(link);
            link.click();
            document.body.removeChild(link);
            window.URL.revokeObjectURL(url);
        },

image.png

想实现默认展示如下图格式
image.png

阅读 1k
avatarAI BotBETA

ExcelJS 在处理单元格换行时,需要确保单元格内容的格式设置正确。在你提供的代码中,你已经设置了 wrapTexttrue,这是正确的。但是,有时候仅仅设置 wrapText 并不足以确保内容在打开文件时自动换行。

要解决这个问题,你可以尝试在添加单元格内容之前,先将内容拆分为多行,然后再添加到工作表中。这样可以确保 Excel 在打开文件时能够正确地显示换行内容。

下面是一个修改后的代码示例,展示了如何拆分单元格内容为多行:

async handleExport() {
    const workbook = new ExcelJS.Workbook();
    const worksheet = workbook.addWorksheet('Sheet1');

    // 添加表头
    const headerRow = this.titleName.map(item => item.labelName);
    worksheet.addRow(headerRow);

    // 将数据添加到工作表
    this.tableData.forEach(dataRow => {
        const rowData = this.titleName.map(item => {
            if (dataRow[item.val].values.type === 'text') {
                return dataRow[item.val].values.kpi_name;
            } else {
                const data = [
                    "类型:指标",
                    "数据来源:" + (dataRow[item.val].values.dataSource.indexOf("报表") !== -1 ? "掌上经分-报表(同经分前台-报表中心)" : (dataRow[item.val].values.dataSource.indexOf("网页经分") !== -1 ? "网页经分" : "掌上经分-指标(同经分前台-关键指标)")),
                    "指标ID:" + dataRow[item.val].values.kpi_id,
                    "指标名称:" + dataRow[item.val].values.kpiCascaderName,
                    "指标单位:" + dataRow[item.val].values.kpi_unit,
                    "指标路径:" + dataRow[item.val].values.kpiRoute,
                    "数据动态时间:" + (dataRow[item.val].values.TIME_INTERVAL == Number(dataRow[item.val].values.TIME_INTERVAL) ? (dataRow[item.val].values.NUM_VAL ? dataRow[item.val].values.NUM_VAL + '天前' : '') : (dataRow[item.val].values.TIME_INTERVAL && dataRow[item.val].values.TIME_INTERVAL !== "undefined") ? dataRow[item.val].values.TIME_INTERVAL : '').replace(/,/g, ''),
                    "数据固定时间:"+ dataRow[item.val].values.kpi_time,
                    "数据区域:"+dataRow[item.val].values.info,
                    "取值逻辑:"+dataRow[item.val].values.valueLogicRes,
                    // 其他字段依次类推
                ];
                
                // 将数据拆分为多行
                const wrappedText = data.join(String.fromCharCode(10)).split('\n').map(line => ({ t: line, h: 'auto' }));
                
                return wrappedText;
            }
        });
        const row = worksheet.addRow(rowData);
        
        // 设置单元格高度为200没有生效
        row.eachCell((cell) => {
            cell.alignment = { vertical: 'middle' };
            cell.height = 200;
            cell.wrapText = true; // 确保单元格支持换行
        });
    });

    // 设置列宽和文本靠左、垂直居中对齐
    worksheet.columns.forEach((column, index) => {
        column.width = 40; // 设置列宽为 40
        column.eachCell({ includeEmpty: true }, (cell) => {
            cell.alignment = { horizontal: 'left', vertical: 'middle' };
        });
    });

    this.titleName.forEach((item, index) => {
        if (item.format === 'wrapText') {
            worksheet.getColumn(index + 1).eachCell({ includeEmpty: true }, (cell) => {
                cell.alignment = { wrapText: true };
            });
        }
    });

    // 生成 Excel 文件
    const buffer = await workbook.xlsx.writeBuffer();
    const blob = new Blob([buffer], { type: 'application/vnd.openxmlformats-officedocument.spreadsheetml.sheet' });
    const url = window.URL.createObjectURL(blob);
撰写回答
你尚未登录,登录后可以
  • 和开发者交流问题的细节
  • 关注并接收问题和回答的更新提醒
  • 参与内容的编辑和改进,让解决方法与时俱进
推荐问题
宣传栏