【18.0.1】自定义右键菜单实现咨询

Wilson.Zhang

本帖最后由 Wilson.Zhang 于 2025-3-18 17:00 编辑

产品：SpreadJS
版本：18.0.1
调研编号：SJS-28550
Last Review：2025-03-17
当前进展：图片元数据中有Orientation属性，浏览器web无法本就无法读取该属性，导致显示图片效果与图片本身不一致。非功能问题，可在图片元数据中删除Orientation属性。

产品：SpreadJS
版本：18.0.1
调研编号：SJS-28659
Last Review：2025-03-17
当前进展：文件中包含有5000+高宽均为0的形状，导致打开奔溃。非产品功能问题。

各位大佬，我现在有个需求需要用到自定义菜单的功能，我查阅了官方的示例文档以及上下两篇文章。比照着官方的示例来做也没能成功，并且一直报错：
图片.png967068481.png

只有在初始化之前的这种方式(如下图)是成功了的，但是我还是希望能用这篇文章的教学方法。希望老师能给我提供一个最简单的示例，需求如下，并标注一下注释，因为文档中并未对一些参数进行描述，所以压根不知道这些参数的作用是干什么。
图片.png292334899.png

我的需求是在viewport区域右键时，有一个"不含子菜单，单击即执行的菜单项"--->测试1，点击该菜单则在控制台打印当前右键的行列索引。
第二个是"含有子菜单，点击子菜单项执行的菜单项"---->测试2，鼠标移动上去后就显示两个子菜单：①转二维码，②转条形码。顾名思义点击对应的菜单则把右键时的单元格的内容变成二维码/条形码。
附上我最简单版的报错文档

Wilson.Zhang · Wilson.Zhang

您好！通过您提供的demo，了解到您使用的是Designer而不是没有工具栏的SpreadJS控件。

当使用的是Designer时，新增右键菜单选项的自定义信息需要添加至Designer的DefaultConfig对象管理，具体的步骤如下所述：

1. 在DefaultConfig的contextMenu属性中添加菜单选项对象。
2. 在DefaultConfig的commandMap属性中实例化待添加菜单选项对象，同时可在此定义execute方法以定义命令实体。或者将命令实体注册至Workbook的commandManager。

可以参考如下链接中的官网产品文档，参考下图所示位置中的demo：
新增菜单选项
1741654364679.png441916503.png

如果您使用的是SpreadJS控件而不是Designer，您demo中的代码即正确，您可以尝试在其中注释掉Designer实例化的代码，运行测试了解。

但是，已知您使用的是Designer，所以以您demo中的原有代码为基础，添加了Designer中自定义右键菜单的代码，可以正常运行，如下动图所示：
自定义右键菜单.gif

附上demo，以供参考。
关于自定义多级子菜单的实现方式，与自定义普通菜单选项原理一致，父子级菜单之间通过subCommands属性连接，可以参考如下链接中的官网产品文档了解详情：
自定义多级右键菜单

antd · antd

Wilson.Zhang 发表于 2025-3-11 08:59
您好！通过您提供的demo，了解到您使用的是Designer而不是没有工具栏的SpreadJS控件。

当使用的是Design ...

好的，感谢老师解答，我再瞧瞧

antd · antd

Wilson.Zhang 发表于 2025-3-11 08:59
您好！通过您提供的demo，了解到您使用的是Designer而不是没有工具栏的SpreadJS控件。

当使用的是Design ...

老师我在右键菜单中新增了一个菜单用于直接将在线表格导出为Excel，遇到一个小bug：
图片.png231396483.png

导出后的Excel内容：
图片.png731864928.png

不知道为啥图片会变成这样。接着我又用其他图片尝试，其他图片正常，但就一张图片有问题。图片都是jpg格式
图片.png13262938.png

以下是导出部分的代码：
图片.png44804686.png

Wilson.Zhang · Wilson.Zhang

antd 发表于 2025-3-11 12:23
老师我在右键菜单中新增了一个菜单用于直接将在线表格导出为Excel，遇到一个小bug：

导出后的Excel内 ...

我在本地使用多张图片测试，导出后图片均为变化，未能复现问题现象。

我使用了工具栏中插入图片的功能、ctrl+c复制粘贴，均正常。您的图片有什么特殊之处？您可以上传图片，我测试看看。

请教下异常情况时使用的图片是业务相关的图片吗？如果不是，您也可以尝试使用业务相关的图片测试看导出是否有异常。咱们综合排查下。

antd · antd

Wilson.Zhang 发表于 2025-3-11 15:58
我在本地使用多张图片测试，导出后图片均为变化，未能复现问题现象。

我使用了工具栏中插入图片的功能 ...

这并不是业务图片，只是用于测试的图片而已，我也是测试的试试无意间发现这张图片有问题，我这边尝试过像上述那样通过代码导出Excel，也尝试过文件->导出->导出Excel，这张图片都会变形，不知道是什么原因，附上有问题的测试图片。希望在老师那边可以复现问题。
我的操作是：直接插入图片，然后导出Excel，打开Excel就发现图片变形了

Wilson.Zhang · Wilson.Zhang

antd 发表于 2025-3-11 16:11
这并不是业务图片，只是用于测试的图片而已，我也是测试的试试无意间发现这张图片有问题，我这边尝 ...

按照您提供的步骤，在18.0.1版本插入图片，然后通过自定义右键菜单选项导出文件为xlsx，再将导出文件导入至18.01版本Designer中，图片未变形，如下动图所示：
图片导入.gif

自定义右键菜单选项的代码参考自您在4楼提供的图示中的代码片段，如下图所示：
右键菜单自定义导出.png595576781.png

antd · antd

Wilson.Zhang 发表于 2025-3-11 17:46
按照您提供的步骤，在18.0.1版本插入图片，然后通过自定义右键菜单选项导出文件为xlsx，再将导出文件导入 ...

老师，你这边演示的是导出后，又在另一个页面导入，我这边试了一下，导入进来的也是没有问题的。
有问题的是导出的Excel，也就是在本地的Excel是有问题的

Wilson.Zhang · Wilson.Zhang

antd 发表于 2025-3-11 18:04
老师，你这边演示的是导出后，又在另一个页面导入，我这边试了一下，导入进来的也是没有问题的。
有问题 ...

明白了，用Microsoft Excel桌面端软件打开后图片显示与原文件不一致。导入至SpreadJS显示又正常。

先帮您调研下，调研编号为SJS-28550，待有结论后向您同步，请您耐心等候。

antd · antd

Wilson.Zhang 发表于 2025-3-12 09:14
明白了，用Microsoft Excel桌面端软件打开后图片显示与原文件不一致。导入至SpreadJS显示又正常。

先 ...

好的好的，老师那边复现问题了吗

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

[已处理] 【18.0.1】自定义右键菜单实现咨询

最佳答案

18 个回复

时代开发者征文活动