在Vue框架中，重写命令导致执行多次问题。

收藏

本帖最后由 Ellia.Duan 于 2022-12-29 17:40 编辑

很多用户经常有这样子的需求，改写designer中命令，如排序，可以自定义排序规则；粘贴，自定义粘贴内容，过滤不想粘贴的内容，如下代码所示：

var designer = new GC.Spread.Sheets.Designer.Designer(document.getElementById("designerHost"));
var spread = designer.getWorkbook();
var sheet = spread.getActiveSheet();
let designerConfig = JSON.parse(JSON.stringify(GC.Spread.Sheets.Designer.DefaultConfig));
var command = GC.Spread.Sheets.Designer.getCommand('sortAZ');
var oldExecute = command.execute;
command.execute = function (context, propertyName){
console.log('Designer排序事件' ,context, propertyName)
oldExecute.call(this,context, propertyName)
}
designerConfig.commandMap = {
"sortAZ":command
}
designer.setConfig(designerConfig)

复制代码

在获取‘sortAZ’命令后，重写execute方法，在此方法中打印了参数，用户可以根据自己的需要重写execute方法。
此时有的小伙伴发现，在Vue框架中，初始化Designer后，重写命令，发现会执行多次。
如这篇帖子中，https://gcdn.grapecity.com.cn/fo ... 9613&extra=page%3D1
用户重写右键粘贴，在exceute方法中，让其弹窗，发现多次点击多次弹窗。
又比如这位用户 https://gcdn.grapecity.com.cn/forum.php?mod=viewthread&tid=155746
重写了导入文件的相关逻辑，发现路由跳转后，会执行两次，再次路由跳转后，执行三次，依此类推。
造成这种现象的原因是什么呢？

用户想要改写的命令是从全局静态命令映射（GC.Spread.Sheets.Designer.getCommand）中获取，然后，由客户覆盖，并注册回全局静态命令映射。那么，下一次，客户得到的命令就是之前已经改写覆盖了的命令。

为此有一个解决方案就是：不要在设计器初始化逻辑中写这个一次性逻辑，它只需要一次。

那么怎么只执行一次呢？这个也很简单，简而言之就是加把锁，desiigner初始化后执行一次，第二次不执行。

如下代码：

在获取命令后，加一行if语句，如

if(!commandName.flag){

复制代码

因为commandName 此命令没有flag属性，所以其flag值是undefined ,第一次执行的时候，判断!commandName.flag 就可以进入自定义的execute命令。
待execute()执行完成，重写command对象后，此时可以设置flag属性为true

commandName.flag = true;

复制代码

这样子就保证了执行一次，解决执行多次问题啦。

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

在Vue框架中，重写命令导致执行多次问题。

0 个回复

SpreadJS 认证

SpreadJS 高级认证