首页 > 其他分享 >SheetJS 合并后的单元格不能正常显示边框

SheetJS 合并后的单元格不能正常显示边框

时间:2023-12-15 12:00:02浏览次数:23  
标签:font worksheet 单元格 firstRow 边框 param SheetJS firstCol

原配置样式代码

/**
   * 设置单元格样式
   * @param worksheet 工作单元
   * @param firstRow 开始行
   * @param lastRow 结束行
   * @param firstCol 开始列
   * @param lastCol 结束列
   * @param font 字号
   * @param blod 是否加粗
   */
  setCellStyle(worksheet: WorkSheet, firstRow, lastRow, firstCol, lastCol, font, blod) {
    for (var i = firstRow; i <= lastRow; i++) {
      for (var j = firstCol; j <= lastCol; j++) {
        //根据单元格地址转换
        var cell = utils.encode_cell({ c: j, r: i });
        if (worksheet[cell]) {
          worksheet[cell].s = {
            font: {
              sz: font,
              bold: blod
            },
            alignment: {
              horizontal: 'center',
              vertical: 'center',
              wrapText: true
            },
            border: {
              top: { style: 'thin' },
              right: { style: 'thin' },
              bottom: { style: 'thin' },
              left: { style: 'thin' }
            }
          };
        } 
      }
    }
  }

原因

值一般放在合并前的第一个单元格中,合并后其他被合并的单元格cell是配置为空,根据以上代码是没有去设置被置空合并单元格的边框的

解决方式

将置空的单元格设置边框

 worksheet[cell] = {
            s: {
              border: {
                top: { style: 'thin' },
                right: { style: 'thin' },
                bottom: { style: 'thin' },
                left: { style: 'thin' }
              }
            },
            v: ''
          };
        }

注:v属性(单元格值)一定要设置,否则样式不生效

完整代码

/**
   * 设置单元格样式
   * @param worksheet 工作单元
   * @param firstRow 开始行
   * @param lastRow 结束行
   * @param firstCol 开始列
   * @param lastCol 结束列
   * @param font 字号
   * @param blod 是否加粗
   */
  setCellStyle(worksheet: WorkSheet, firstRow, lastRow, firstCol, lastCol, font, blod) {
    for (var i = firstRow; i <= lastRow; i++) {
      for (var j = firstCol; j <= lastCol; j++) {
        //根据单元格地址转换
        var cell = utils.encode_cell({ c: j, r: i });
        if (worksheet[cell]) {
          worksheet[cell].s = {
            font: {
              sz: font,
              bold: blod
            },
            alignment: {
              horizontal: 'center',
              vertical: 'center',
              wrapText: true
            },
            border: {
              top: { style: 'thin' },
              right: { style: 'thin' },
              bottom: { style: 'thin' },
              left: { style: 'thin' }
            }
          };
        } else {
          worksheet[cell] = {
            s: {
              border: {
                top: { style: 'thin' },
                right: { style: 'thin' },
                bottom: { style: 'thin' },
                left: { style: 'thin' }
              }
            },
            v: ''
          };
        }
      }
    }
    return worksheet;
  }

 

标签:font,worksheet,单元格,firstRow,边框,param,SheetJS,firstCol
From: https://www.cnblogs.com/sugarwxx/p/17903057.html

相关文章

  • ExcelVba 单元格历史记录(记录单元格变更历史)
    PublicTrackChangesAsBooleanSubToggleCellHistory()TrackChanges=NotTrackChangesIfTrackChangesThenMsgBox"单元格历史记录功能已开启。"ElseMsgBox"单元格历史记录功能已关闭。"EndIfEndSubPrivateSubWorkbook_She......
  • 纯CSS实现可自定义间距虚线边框
    <!DOCTYPEhtml><html><head><metacharset="utf-8"><title></title><style>.border-wrapper{position:relative;margin:100pxau......
  • NPOI excel 单元格背景色
    需求描述:如下图所示,不合格的单元格,背景色要为灰色。解决方法:不建议使用新样式的方式来实现,因为会破坏原单元格的样式(例如边框、字体),所以只需要修改原样式即可,但有时候原样式是共享的,也就是很多单元格用同一个样式,所以解决思路是复制一个新样式给该单元格即可。 核心代码:......
  • 在使用openpyxl库操作带有合并单元格的Excel文件时,插入新的行或列可能会导致后面的数
    在使用openpyxl库操作带有合并单元格的Excel文件时,插入新的行或列可能会导致后面的数据错乱。这是因为openpyxl库在插入或删除行或列时,不会自动更新合并单元格的范围1。解决这个问题的一种方法是在插入新的行或列之前,先保存所有合并单元格的范围,然后在插入新的行或列之后,根据......
  • CSS如何给字体加边框
    <h1>字体边框</h1>h1{background-color:black;font-family:"Raleway",sans-serif;font-size:28px;color:red;//下方是加边框的内容text-shadow:4px4px0white,4px-4px0white,-4px-4px0white,-4px4px0white,4px3px0w......
  • 如何使用 Java 代码实现设置 Excel 单元格的格式?
    要使用Java代码设置Excel单元格的格式,您可以使用ApachePOI库。以下是一个示例代码,演示如何设置Excel单元格的格式:importorg.apache.poi.ss.usermodel.*;importorg.apache.poi.xssf.usermodel.XSSFWorkbook;importjava.io.FileOutputStream;importjava.io.IOException;pu......
  • input输入时的边框样式去除
    很多程序员在写项目过程中,会遇到input的边框样式去除问题。今天我们就研究一下,有什么办法解决这个问题?一般的,我们会给input设置:input{ border:none; }这种方法,我们去除的是显示样式,但是输入的时候,我们需要点击一下input框,发现还是有一个黑色的初始化边框:这种情况,怎么处理?我们可......
  • 视频直播源码,去掉Button自带边框
    视频直播源码,去掉Button自带边框实现html代码 <view><buttonclass="contactBtn"open-type="contact"@contact="handleContact"session-from="sessionFrom">意见反馈</button></view> ​css代码.contactBtn{border:none......
  • Excel合并单元格的缺点解决方式
    背景99%的人在创建表格的一个标题,都喜欢使用合并单元格的功能但是由于使用Excel的合并单元格,在数据分析统计的时候出现了一些问题复制粘贴数据时,由于有合并单元格,不能直接复制粘贴移动整列的位置,不能快速移动使用VLOOKUP函数时,无法直接选中列区域,只能手动选中单元格区域......
  • Excel表格存在不同大小的合并单元格怎么排序?
    当Excel表格中存在不同大小的合并单元格时,进行排序可能会出现一些难题。因为合并单元格会影响数据的布局,导致排序结果不符合预期。下面我将详细介绍如何在包含不同大小合并单元格的Excel表格中进行排序,希望对您有所帮助。1.确定排序规则在进行排序之前,首先需要明确排序的规则......