SpreadJS cellButtons如何注册命令

1、首先我们先来学习下 cellButtons
单元格按钮cellButtons是一组多个预定义按钮，可以嵌入到单元各中并可以运行各种命令。
示例代码：

1. let style = new GC.Spread.Sheets.Style();
   
2.    style.cellButtons= [{
   
3.          imageType: GC.Spread.Sheets.ButtonImageType.dropdown,
   
4.          command: "openColorPicker",
   
5.       },
   
6.       {
   
7.          imageType: GC.Spread.Sheets.ButtonImageType.dropdown,
   
8.          command: (sheet, row, col, option) => {
   
9.                //do something
   
10.          },
    
11.       }
    
12.    ];
    
13.    sheet.setStyle(0, 0, style);
    
14.    sheet.setValue(0, 0, "Text");

复制代码

ButtonImageType 指定了单元格按钮的类型，SpreadJS提供了多个选项，您可以根据需要自行选择。
command 为命令选项，开发人员可以为用户单击按钮时执行的特定行为编写代码。
2、cellButtons如何注册命令
除了上述示例代码所示，我们还可以在命令管理器中注册该命令进行管理。以附件demo为例：
先来定义cellButtons点击触发的命令：

1. var command = {
   
2.             canUndo: true,
   
3.             execute: function (context, options, isUndo) {
   
4.                 alert('触发');
   
5.             }
   
6.         }

复制代码

向命令管理器注册command，定义命令名称为 alertSth

1. var commandManager = spread.commandManager();
   
2.         commandManager.register("alertSth", command);

复制代码

创建一个style，并设置cellButtons,cellButtons执行 alertSth命令。

1. style.cellButtons = [
   
2.             {   
   
3.                 imageType: GC.Spread.Sheets.ButtonImageType.ellipsis,
   
4.                 command: "alertSth"
   
5.             }
   
6.         ];

复制代码

最后在单元格设置style

1. sheet.setStyle(0, 0, style);

复制代码

效果如下图所示：




3、我们将spread导出为ssjson文件，并导入到spread2中，会发现点击单元格按钮，无法弹出弹窗。
这是因为我们在spread2中没有注册 alertSth 命令，只需重新注册即可。

1. var command = {
   
2.             canUndo: true,
   
3.             execute: function (context, options, isUndo) {
   
4.                 alert('触发');
   
5.             }
   
6.         }
   
7.         var commandManager = spread.commandManager();
   
8.         commandManager.register("alertSth", command);

复制代码

附件为示例demo，大家可以参考下。

请问支持11.1 版本么？

单元格按钮是自V13开始支持的，V11不支持