Winny 发表于 2022-11-17 17:45:18

SpreadJS禁用工作表页签处的右键菜单

SpreadJS提供了工作表上的参数spread.options.allowContextMenu=false来禁用右键菜单,但这种会同时禁用掉所有的右键菜单。在部分场景下,客户需要对表单进行操作,启用工作表区域的右键菜单。但不需要新增、删除整个工作表,这就需要禁用工作表页签处的右键菜单。
SpreadJS分为两部分,分别是组件运行时及在线表格编辑器,这两者右键菜单上有一定差异,因此在禁用的代码上也会略有差异。对于组件运行时,它的右键菜单结构下如下:

可以看到,每个右键菜单都会有workArea这个属性,我们只需要遍历所有的右键菜单去查找对应的workArea是否包含工作表页签(sheetTab),如果workArea包含sheetTab,则去除该数组项即可,详细代码如下:
// 获取当前spread的右键菜单
let menuData = spread.contextMenu.menuData
//删除命中菜单项
for(let i=0;i<menuData.length;i++){
    if(menuData.workArea && menuData.workArea.indexOf("sheetTab")!=-1){
    menuData.splice(i,1)
    i--
    }
}

对于在线表格编辑器,它的右键菜单相关的结构如下:

可以看到,它并没有显示区域workArea的标记。这是因为设计器中的右键菜单是根据配置信息动态处理而来。如果想修改设计器的右键菜单,需要从GC.Spread.Sheets.Designer.DefaultConfig中去更改.

如上图所示,config中的contextMenu代表的就是右键菜单命令字符串,调用GC.Spread.Sheets.Designer.getCommand("contextMenuCut")可以得到命令的详细信息,其中visibleContex代表的就是右键菜单显示的条件。

如果想要禁用工作表页签处的右键菜单,只需将visibleContext中包含“TabStripSelected”的数组项删除即可,详细代码如下:
let config = GC.Spread.Sheets.Designer.DefaultConfig
for(let i=0;i<config.contextMenu.length;i++){
    if(GC.Spread.Sheets.Designer.getCommand(config.contextMenu).visibleContext && GC.Spread.Sheets.Designer.getCommand(config.contextMenu).visibleContext.indexOf("TabStripSelected")!=-1){
      config.contextMenu.splice(i,1)
      i--
    }
}

let designer = new GC.Spread.Sheets.Designer.Designer("designer-container",config)查看实际效果可点击这里体验。

页: [1]
查看完整版本: SpreadJS禁用工作表页签处的右键菜单