Lynn.Dou 发表于 2020-12-21 11:28:36

SpreadJS在线表格编辑器自定义功能 - 新建右键菜单(Content Menu)

本帖最后由 Lynn.Dou 于 2021-9-10 14:15 编辑

在前面的教程中我们学习了 组件版设计器的 初始化 和 新建工具栏按钮
本节课我们继续来学习组件版设计器如何自定义右键菜单。
1. 自定义右键菜单—删除
示例:我想删除单元格右键菜单的 “删除”项,应该如何操作呢?


(1)获取designer的DefaultConfig


var CustomerConfig = GC.Spread.Sheets.Designer.DefaultConfig;

(2) 如下图,右键菜单contextMenu为一个包含多个命令名称的数组。

接下来我们需要做出判断,遍历contextMenu找到我们指定要删除的命令名称(示例:DeleteDialog),然后使用splice方法将其删除。
if (CustomerConfig.contextMenu) {
    for (let i = 0; i < CustomerConfig.contextMenu.length; i++) {
      if (CustomerConfig.contextMenu=== GC.Spread.Sheets.Designer.CommandNames.DeleteDialog) {
            CustomerConfig.contextMenu.splice(i, 1)
      }
    }
}

(3) 创建一个新的designer,CustomerConfig为其参数。
var designer = new GC.Spread.Sheets.Designer.Designer(
    document.getElementById('gc-designer-container'),
    CustomerConfig
);


这样,单元格右键菜单的“删除”项就被删除了。

删除右键菜单其他项同理,只需将 CommandNames.DeleteDialog 修改为对应的名称即可。

freedom2012 发表于 2021-7-22 17:51:40

有个问题,这种方式右键菜单里回调里的state(hook)状态值不会更新

freedom2012 发表于 2021-7-22 18:16:56

如果我要根据单元格内容展示不同的右键菜单怎么办,new GC.Spread.Sheets.Designer.Designer 是不行的它会把表格数据和事件监听全部冲掉?

Lynn.Dou 发表于 2021-7-22 18:41:10

您可以参考下方链接贴:
https://gcdn.grapecity.com.cn/showtopic-54101-1-325.html

另,为便于后续交流,关于此问题建议您在求助中心发新帖,教程集锦容易漏贴。
页: [1]
查看完整版本: SpreadJS在线表格编辑器自定义功能 - 新建右键菜单(Content Menu)