SpreadJS在线表格编辑器自定义功能 - 删除默认配置项（DefaultConfig）

在我们提供的组件版设计器中，工具栏提供了相当丰富的按钮和菜单栏。但是，可能有许多小伙伴可能用不了那么多的功能，这时候我们可以将不需要的按钮或者菜单栏去除。那就开始看下如何实现吧。

首先来讲讲如何删除某个按钮。例如，我们想删除左上角的撤销重做按钮

我们需要获取到设计器的DefaultConfig

1. var designerConfig = JSON.parse(JSON.stringify(GC.Spread.Sheets.Designer.DefaultConfig))

复制代码

我们可以看到designerConfig.ribbon[0].buttonGroups是一个数组

这时候我们可以用Slice将这这项删除

1. designerConfig.ribbon[0].buttonGroups.splice(0,1);
   

复制代码

最后我们将designerConfig传进designer

1. new GC.Spread.Sheets.Designer.Designer(
   
2.         document.getElementById('gc-designer-container'),
   
3.         designerConfig,
   
4.     );

复制代码

这时候左上角的撤销重做已经消失了


那么如何把整个菜单栏去掉呢？我们来看下如何去掉”设置“菜单栏。同理，还是需要拿到设计器的DefaultConfig

1. var designerConfig = JSON.parse(JSON.stringify(GC.Spread.Sheets.Designer.DefaultConfig))

复制代码

我们再来看下designerConfig.ribbon里面有什么。同样，也一个数组，"设置"菜单栏的下标为5.

1. designerConfig.ribbon.splice(5,1)

复制代码

与上面操作一致，我们将这个config传进去

1. new GC.Spread.Sheets.Designer.Designer(
   
2.         document.getElementById('gc-designer-container'),
   
3.         designerConfig,
   
4.     );

复制代码

可以看到”设置“已经消失，大功告成。

你好，我将菜单栏全部删除后会报错gc.spread.sheets.designer.all.15.0.2.min.js:1
        
       Uncaught (in promise) TypeError: Cannot read properties of undefined (reading 'id')，请问如何解决？

ELN 发表于 2022-5-12 09:03
你好，我将菜单栏全部删除后会报错gc.spread.sheets.designer.all.15.0.2.min.js:1
        
       Unc ...

确实会出现报错，我这边来重新调研一下，建议开一个新帖，方便后续的跟踪处理。

Derrick.Jiao 发表于 2022-5-12 10:15
确实会出现报错，我这边来重新调研一下，建议开一个新帖，方便后续的跟踪处理。

有结果吗？我试了也报错

a杰 发表于 2022-6-28 14:31
有结果吗？我试了也报错

这是一个产品行为，设计器的核心就是上方的ribbon，因此不支持将上方的ribbon全部删除，如果不想要用ribbon，直接使用SpreadJS即可。

Derrick.Jiao 发表于 2022-6-28 16:02
这是一个产品行为，设计器的核心就是上方的ribbon，因此不支持将上方的ribbon全部删除，如果不想要用ribb ...

这个有办法删除或者隐藏吗

Hyao 发表于 2022-10-9 10:48
这个有办法删除或者隐藏吗

只引入SpreadJS就不会出现上方的红框区域了。
如果是想在设计器的基础上隐藏红框区域，可以参考以下代码：

1. document.getElementsByClassName("top-panels")[0].style.display='none';

复制代码