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

收藏

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

可以看到，每个右键菜单都会有workArea这个属性，我们只需要遍历所有的右键菜单去查找对应的workArea是否包含工作表页签（sheetTab），如果workArea包含sheetTab，则去除该数组项即可，详细代码如下：

// 获取当前spread的右键菜单
let menuData = spread.contextMenu.menuData
//删除命中菜单项
for(let i=0;i<menuData.length;i++){
if(menuData[i].workArea && menuData[i].workArea.indexOf("sheetTab")!=-1){
menuData.splice(i,1)
i--
}
}

复制代码

对于在线表格编辑器，它的右键菜单相关的结构如下：
image.png717151488.png

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

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

如果想要禁用工作表页签处的右键菜单，只需将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[i]).visibleContext && GC.Spread.Sheets.Designer.getCommand(config.contextMenu[i]).visibleContext.indexOf("TabStripSelected")!=-1){
config.contextMenu.splice(i,1)
i--
}
}
let designer = new GC.Spread.Sheets.Designer.Designer("designer-container",config)

复制代码

查看实际效果可点击这里体验。

		自动登录	找回密码
密码			立即注册

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

0 个回复