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 修改为对应的名称即可。
有个问题,这种方式右键菜单里回调里的state(hook)状态值不会更新 如果我要根据单元格内容展示不同的右键菜单怎么办,new GC.Spread.Sheets.Designer.Designer 是不行的它会把表格数据和事件监听全部冲掉? 您可以参考下方链接贴:
https://gcdn.grapecity.com.cn/showtopic-54101-1-325.html
另,为便于后续交流,关于此问题建议您在求助中心发新帖,教程集锦容易漏贴。
页:
[1]