jsplumb dom 位置发生变化，连线错位

4、jsplumb 在 dom 位置发生变化 jsplumb 监听不到，所以连线位置不对。

场景：点击按钮查找parent 的关系，展示parent,相反查找 children, 但是按钮盒子的位置变化了，连线位置没有变化。

本来不打算单独写这个博客的，在bug管理中单独记录了这个问题，但是由于我解决的时间过长，并且在国内搜索不到有效的解决办法，希望小伙伴不要像我这么浪费时间。

因为jsplumb 连线的时候 是记录的source 和 target 分别是 nodeId，当你在传入相同的 source 和 target jsplumb 认为是同一条线，不会重新绘制。这个问题困绕我一整天的时间，在同事的帮忙下才解决的，因为国内关于这个介绍的很少，没有看到类似的问题，但是我相信肯定有这样的API,于是让我同事用英文的方式进行搜索。

instance.reset() 清除jsplumb的所有连线关系，相当于清楚 jsPlumb 的连线缓存

this.$nextTick(() => {
    
    this.datasetInstance.reset()
    jsPlumb.batch(() => {
      this.datasetEdges.forEach(item => {
      this.datasetInstance.connect({
          source: item.source,
          target: item.target,
          overlays: [
          ], 
        }, this.datasetCommon);
      });
    },true)
});
复制代码

转载于:https://juejin.im/post/5bf39ce3e51d4537d6742c09