jsplumb使用

遇到的问题

在使用jsplumb插件创建流程图连接时，遇到了一个Uncaught RangeError: Maximum call stack size exceeded错误。

具体代码如下：

在设置overlays的值时，以变量的形式传递了一个配置项，由于该变量是个数据，所以传递的是引用。

jsplumb插件在连线之前，会先构造源节点和目标节点的相关数据，详细过程这里不介绍，展示两处引起错误的关键代码：

在jsplumb插件源码的第4782行和第4849行，这两处会向节点配置数据的overlays项中推入创建连接时传入的overlays配置。因为overlays配置传递的是引用，所以造成了页面上所有的节点共用了一个overlays配置，当页面中的连线次数达到一定程度后，overlays配置中的数据量是非常惊人的，如下如所示：

解决方法

解决方法很简单，错误是所有节点共用一个overlays造成的，只需要在创建连接时将overlays: flowConfig.Overlays的形式改为overlays: [...]即可。即每次创建连接时都生成一个新的数组。

在javascript中，或者说在编程语言中，引用是个比较特殊的机制，是一把双刃剑。使用引用时，要考虑到一些边界情况，安全地使用。