SpreadJS在线表格编辑器自定义功能 - 重定义下拉菜单命令

有小伙伴在看了 SpreadJS在线表格编辑器自定义功能 - 命令（Command）重定义 这篇文章后，在下拉想用同样的方法修改下拉菜单里面的命令，发现不成功。这是因为下来菜单按钮也是一个命令，修改里面的子命令后，依然会重新指回原来的命令，导致重定义不生效。

那么，我们要做的就是修改原来的命令的同时，也要修改命令的名称。完成后再重新放回去到原来的命令以及原来的下拉列表的命令中。下面给大家讲一个列子，教大家如何具体实现。

我们打开编辑器，看到下图可以发现，这是一个典型的“下拉列表命令下的子命令”


首先我们获取设计器的默认config
var designerConfig = JSON.parse(JSON.stringify(GC.Spread.Sheets.Designer.DefaultConfig))


接着还是老规矩，找命令，首先我们找到这个下拉列表的命令

以及要修改的子命令名称
GC.Spread.Sheets.Designer.getCommand("alignmentMergeList");


定义一个CommadMap集合
designerConfig.commandMap = {}


为原命令添加一个alert
let MergeAcross = GC.Spread.Sheets.Designer.getCommand("mergeAcross");
    let newExecuteMergeCenter = MergeAcross.execute;
    MergeAcross.execute = function(context, propertyName) {
        alert("我是合并");
        newExecuteMergeCenter.call(this, context, propertyName);
    };


获取下拉列表的命令并替换新的命令名称
let NewList = GC.Spread.Sheets.Designer.getCommand("alignmentMergeList");
NewList.subCommands[1].commandName = "newMergeAcross";


然后放回commandMap里面
designerConfig.commandMap[GC.Spread.Sheets.Designer.CommandNames.AlignmentMergeList] = NewList;
designerConfig.commandMap[GC.Spread.Sheets.Designer.CommandNames.MergeAcross] = MergeAcross;


最后用setConfig将其放回默认config里面
var designer = GC.Spread.Sheets.Designer.findControl('gc-designer-container');
designer.setConfig(designerConfig)


大功告成