表格列设置自定义单元格类型，渲染未刷新

登录

本帖最后由清风沐阳于 2026-1-9 13:50 编辑

需求：
一、新建表格中设置表格列单元格类型

1、自定义单元格类型，见附件；
2、在sheet设计器中创建一个表格，如图：

3、使用以下代码设置表格第一列的单元格类型，

const workbook = designer?.getWorkbook() as any;
const sheet = workbook.getActiveSheet();
sheet?.setValue(3, 2, false);
const table = sheet.tables.find(3, 2);
const columnLayoutStyle = table.columnLayoutStyle(0) as GC.Spread.Sheets.Tables.ITableLayoutStyle;
columnLayoutStyle.data = new GC.Spread.Sheets.Style();
// @ts-ignore
columnLayoutStyle.data.cellType = new BoolCellType();
table.columnLayoutStyle(0, columnLayoutStyle);

复制代码

成功设置并显示，如图：

4、选中表格第一个单元格，点击“清除”按钮执行清除操作，如图：

5、重新执行第三步代码，设置表格第一列单元格类型，设置后样式未刷新，如图：

二、在通过workbook.fromJSON加载的sheet模版中设置表格列单元格类型
1、通过workbook.fromJSON加载的sheet模版，模板中有一个表格，和第一项中的表格同理；
2、使用以下代码设置表格第一列的单元格类型：

const workbook = designer?.getWorkbook() as any;
const sheet = workbook.getActiveSheet();
sheet?.setValue(3, 2, false);
const table = sheet.tables.find(3, 2);
const columnLayoutStyle = table.columnLayoutStyle(0) as GC.Spread.Sheets.Tables.ITableLayoutStyle;
columnLayoutStyle.data = new GC.Spread.Sheets.Style();
// @ts-ignore
columnLayoutStyle.data.cellType = new BoolCellType();
table.columnLayoutStyle(0, columnLayoutStyle);

复制代码

3、表格设置后未刷新样式，和第一项遇到问题同理

Richard.Huang · Richard.Huang

您的问题我分开进行回复。
1. 清除之后无法设置单元格类型的问题我本地已经复现，下来需要进行进一步调研，调研结束后我会在本贴中进行进一步沟通和回复
2. 该场景应该是在清除之后做的文件保存，然后fromJSON之后执行同样代码没有修改。这本质和上面是同样的情况。

清风沐阳 · 清风沐阳

是的，本质是一回事，等你好消息

Richard.Huang · Richard.Huang

清风沐阳发表于 2026-1-9 17:02
是的，本质是一回事，等你好消息

Richard.Huang · Richard.Huang

您好，调研结果出来了，本质上是设计器上的清除按钮会将单元格上的样式设置为null，造成样式的集成打断。因此您后续用programming设置table样式会造成无法继承的问题。解决这个问题也很简单，在设置样式之前，调用clear将单元格样式设置为初始状态就行了，代码如下：

var table = sheet.tables.all()[0]
sheet.clear(table.dataRange().row,table.dataRange().col,table.dataRange().rowCount,1,GC.Spread.Sheets.SheetArea.viewport,GC.Spread.Sheets.StorageType.style);
var cellType2 = new GC.Spread.Sheets.CellTypes.ComboBox();
cellType2.items(["a","b","c"]);
var columnLayoutStyle = table.columnLayoutStyle(0)
columnLayoutStyle.data = new GC.Spread.Sheets.Style();
columnLayoutStyle.data.cellType = cellType2;
table.columnLayoutStyle(0, columnLayoutStyle);

复制代码

[处理中] 表格列设置自定义单元格类型，渲染未刷新

4 个回复

SpreadJS认证

SpreadJS高级认证