优化连接线

src/pages/components/drawModal/LineDouble.vue

@@ -119,7 +119,7 @@ export default {
         let arrNew = ref([])//新的存储fdcdids
         let gv = ref('')
         let pastLoading = ref(false)
-        let leaderLineList = ref([])//组件leader-line数据，以方便离开组件时清除画线
+        let leaderLineList = ref({})//组件leader-line数据，以方便离开组件时清除画线,key：start和end对象的端子id组合，value为line对象
         watch(() => props.modelId, (newVal) => {
             modelIds.value = newVal
         })
@@ -231,7 +231,11 @@ export default {
                             // console.log(starts, ends, '??????');
                             // 检查 starts 和 ends 是否存在
                             if (starts && ends) {
-                                leaderLineList.value.push(new LeaderLine(starts, ends, {
+                                /*
+                                leaderLineList.value.push();
+                                */
+                               const key=line.start+','+line.end
+                               leaderLineList.value[key] = new LeaderLine(starts, ends, {
                                     color: "#ccc",
                                     size: 2,
                                     path: "straight",
@@ -239,7 +243,7 @@ export default {
                                     endSocket: "left",
                                     endPlug: 'arrow3',
                                     endPlugSize: 2
-                                }));
+                                })
                                 hiddenLine();
                                 pastLoading.value = false
                             } else {
@@ -442,7 +446,7 @@ export default {
         };
         // 稳定leader-line函数
         function removeLine3() {
-            leaderLineList.value = [];
+            leaderLineList.value = {};
             const elmWrapper = document.getElementById("wrapper");
             if (elmWrapper) {
                 document.body.querySelectorAll("#wrapper .leader-line").forEach((node) => {
@@ -455,7 +459,10 @@ export default {
             setIndex()
         })
         onBeforeUnmount(() => {
-            leaderLineList.value.forEach(line => line.remove());//离开当前组件时清除连线
+            for(let key in leaderLineList.value){
+                leaderLineList.value[key].remove();
+            }
+            //leaderLineList.value.forEach(line => line.remove());//离开当前组件时清除连线
             removeLine3()
         })
         return {