viewLengthText private

src/components/fabric/QLine.js

@@ -3,6 +3,7 @@ import { fabric } from 'fabric'
 export default class QLine extends fabric.Line {
   #length
   #text
+  #viewLengthText
 
   constructor(points, option) {
     super(points, option)
@@ -15,7 +16,7 @@ export default class QLine extends fabric.Line {
     const dx = this.x2 - this.x1
     const dy = this.y2 - this.y1
     this.#length = Math.sqrt(dx * dx + dy * dy).toFixed(0)
-    this.viewLengthText = option.viewLengthText ?? true
+    this.#viewLengthText = option.viewLengthText ?? true
   }
 
   #addControl() {
@@ -46,11 +47,12 @@ export default class QLine extends fabric.Line {
 
     this.on('removed', () => {
       this.canvas.remove(this.#text)
+      this.#text = null
     })
   }
 
   setViewLengthText(bool) {
-    this.viewLengthText = bool
+    this.#viewLengthText = bool
     this.#addLengthText()
   }
 
@@ -59,7 +61,7 @@ export default class QLine extends fabric.Line {
       this.canvas.remove(this.#text)
     }
 
-    if (this.viewLengthText) {
+    if (this.#viewLengthText) {
       const text = new fabric.Text(this.#length, {
         left: (this.x1 + this.x2) / 2,
         top: (this.y1 + this.y2) / 2,

src/components/fabric/QRect.js

@@ -39,12 +39,6 @@ export default class QRect extends fabric.Rect {
       this.#addLengthText()
     })
 
-    this.on('removed', (e) => {
-      this.#text.forEach((text) => {
-        this.canvas.remove(text)
-      })
-    })
-
     this.on('moving', () => {
       this.#addLengthText()
     })