fix: use element.uuid to get editingElement

ly525
1 parent 3dbef87b
Showing 3 changed files with 16 additions and 3 deletions
front-end/h5/src/components/core/editor/canvas/edit.js
front-end/h5/src/components/core/models/element.js
front-end/h5/src/components/core/plugins/lbp-text.js
@@ -193,6 +193,7 @@ export default {
                   props: element.getProps()
                 })
               }
+              const isEditingElement = this.editingElement && this.editingElement.uuid === element.uuid
               const data = {
                 style: {
                   width: '100%',
@@ -203,7 +204,8 @@ export default {
                 class: 'element-on-edit-canvas',
                 props: {
                   ...element.getProps(), // #6 #3,
-                  editorMode: 'edit'
+                  editorMode: 'edit',
+                  isEditingElement
                 },
                 // nativeOn: {
                 //   contextmenu: e => {
@@ -4,6 +4,12 @@ import { parsePx } from &#39;@/utils/element.js&#39;
 const disabledPluginsForEditMode = ['lbp-form-input', 'lbp-form-button', 'lbp-video']
 const cloneObj = (value) => JSON.parse(JSON.stringify(value))
+var seed = 0
+var now = Date.now()
+
+function getUuid (ele) {
+  return `element_${ele.name}_${now}_${seed++}`
+}
 const defaultStyle = {
   top: 100,
   left: 100,
@@ -19,7 +25,7 @@ const defaultStyle = {
 class Element {
   constructor (ele) {
     this.name = ele.name
-    this.uuid = ele.uuid || +new Date()
+    this.uuid = ele.uuid || getUuid(ele)
     /**
      * #!zh:
      * 之前版本代码：https://github.com/ly525/luban-h5/blob/a7875cbc73c0d18bc2459985ca3ce1d4dc44f141/front-end/h5/src/components/core/models/element.js#L21
@@ -22,7 +22,7 @@ export default {
     clickOutside: vClickOutside.directive
   },
   render (h) {
-    const canEdit = this.canEdit && this.editorMode === 'edit'
+    const canEdit = this.canEdit && this.editorMode === 'edit' && this.isEditingElement
     const style = {
       position: 'relative',
       color: `${this.color} !important`,
@@ -109,6 +109,11 @@ export default {
       defaultValue: 'preview', // 可选值: preview/edit
       label: '模式',
       visible: false
+    }),
+    isEditingElement: PropTypes.boolean({
+      defaultValue: false, // 可选值: preview/edit
+      label: '是否当前元素',
+      visible: false
     })
   },
   editorConfig: {