fix: fix roundable line index #756

daybrush · Oct 10, 2022 · 83d5232 · 83d5232
1 parent 99da903
commit 83d5232
Show file tree

Hide file tree

Showing 2 changed files with 13 additions and 2 deletions.
diff --git a/packages/react-moveable/src/react-moveable/ables/Roundable.tsx b/packages/react-moveable/src/react-moveable/ables/Roundable.tsx
@@ -237,7 +237,17 @@ export default {
         const isControl = className.indexOf("border-radius") > -1;
         const isLine = className.indexOf("moveable-line") > -1 && className.indexOf("moveable-direction") > -1;
         const controlIndex = isControl ? parseInt(inputTarget.getAttribute("data-radius-index"), 10) : -1;
-        const lineIndex = isLine ? parseInt(inputTarget.getAttribute("data-line-index"), 10) : -1;
+        let lineIndex = -1;
+
+        if (isLine) {
+            const indexAttr = inputTarget.getAttribute("data-line-index")!;
+
+            lineIndex = parseInt(indexAttr.replace(/render-line-/g, ""), 10);
+
+            if (isNaN(lineIndex)) {
+                lineIndex = -1;
+            }
+        }
 
         if (!isControl && !isLine) {
             return false;
@@ -377,6 +387,7 @@ export default {
 
                 addBorderRadius(controlPoses, poses, lineIndex, distX, distY, width, height);
             }
+
             if (length !== controlPoses.length) {
                 triggerRoundEvent(
                     moveable,

diff --git a/packages/react-moveable/src/react-moveable/renderDirections.tsx b/packages/react-moveable/src/react-moveable/renderDirections.tsx
@@ -146,7 +146,7 @@ export function renderLine(
     return <div key={`line-${key}`}
         className={prefix("line", "direction", direction ? "edge" : "", direction, ...classNames)}
         data-rotation={rotation}
-        data-line-index={key}
+        data-line-key={key}
         data-direction={direction} style={getLineStyle(pos1, pos2, zoom, rad)}></div>;
 }