解决自定义命令触发多次的问题

在使用在线表格编辑器过程中，往往需要自定义一些符合需求场景的命令，如保存模板结构时，想要获取一些其他数据，这时候可以在execute方法中重写saveSchema命令。如下面的代码所示：

1. let config = GC.Spread.Sheets.Designer.DefaultConfig;
   
2.     var command = GC.Spread.Sheets.Designer.getCommand("saveSchema");
   
3.     var oldExecute = command.execute;
   
4.     command.execute = function (context, propertyName){
   
5.       console.log('触发execute')
   
6.       oldExecute.call(this,context, propertyName)
   
7.     }
   
8. 
   
9.     config.commandMap = {
   
10.       "saveSchema":command
    
11.     }

复制代码

但是在Vue中使用路由跳转时，发现一个问题，随着路由跳转的次数增多，execute会执行越来越多，这是怎么回事了？
咱们先复现一个这个问题：
步骤一：访问http://127.0.0.1:5173/designer，点击”保存模板结构“按钮，观察控制台，随后点击”go“按钮，跳转至http://127.0.0.1:5173/test 页面

步骤二：在http://127.0.0.1:5173/test 页面点击”返回“按钮，重新跳转回http://127.0.0.1:5173/designer

步骤三：此时重复第一步骤，发现控制台打印了两条数据


重复上述步骤，发现打印次数越来越多。造成此结果的原因是：
每次，命令都是从全局静态命令映射 (GC.Spread.Sheets.Designer.getCommand) 中获取。然后重写了自定义命令覆盖了之前的，并注册回全局静态命令映射。
因此，下一次，得到的命令是之前覆盖的命令。
那么，怎么解决这个问题呢?这里可以设置一个开关。如下代码所示：判断command.flag是否为真，因为首次加载时，command.flag为undefined ,所以可以进行命令注册，注册结束后令command.flag为false。这样子路由跳转后，就不会再注册自定义命令啦。

1.   let config = GC.Spread.Sheets.Designer.DefaultConfig;
   
2.     var command = GC.Spread.Sheets.Designer.getCommand("saveSchema");
   
3.     var oldExecute = command.execute;
   
4.     if(!command.flag){
   
5.       command.execute = function (context, propertyName){
   
6.         console.log('触发execute')
   
7.         oldExecute.call(this,context, propertyName)
   
8.       }
   
9. 
   
10.       config.commandMap = {
    
11.         "saveSchema":command
    
12.       }
    
13.       command.flag = true;
    
14.     }

复制代码