ICode9

精准搜索请尝试: 精确搜索
首页 > 其他分享> 文章详细

jsplumb使用

2021-06-10 14:33:05  阅读:222  来源: 互联网

标签:插件 配置 jsplumb 引用 使用 overlays 节点


jsplumb使用

遇到的问题

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

具体代码如下:

image

image

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

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

image

image

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

image

解决方法

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

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

标签:插件,配置,jsplumb,引用,使用,overlays,节点
来源: https://www.cnblogs.com/lee3/p/14870924.html

本站声明: 1. iCode9 技术分享网(下文简称本站)提供的所有内容,仅供技术学习、探讨和分享;
2. 关于本站的所有留言、评论、转载及引用,纯属内容发起人的个人观点,与本站观点和立场无关;
3. 关于本站的所有言论和文字,纯属内容发起人的个人观点,与本站观点和立场无关;
4. 本站文章均是网友提供,不完全保证技术分享内容的完整性、准确性、时效性、风险性和版权归属;如您发现该文章侵犯了您的权益,可联系我们第一时间进行删除;
5. 本站为非盈利性的个人网站,所有内容不会用来进行牟利,也不会利用任何形式的广告来间接获益,纯粹是为了广大技术爱好者提供技术内容和技术思想的分享性交流网站。

专注分享技术,共同学习,共同进步。侵权联系[81616952@qq.com]

Copyright (C)ICode9.com, All Rights Reserved.

ICode9版权所有