editor

src/modules/editor/components/CompUI/basicUI/Text/component2.tsx

@@ -68,6 +68,7 @@ const EditorComp = defineComponent({
 
   setup(props, { emit }) {
     let editorRefVal = ref<HeadlessEditor>().value;
+    let editorDomRef=ref<HTMLElement>()
     const comp = useCompData(props.compId);
     const { store, actions, helper, controls } = useEditor();
 
@@ -159,17 +160,17 @@ const EditorComp = defineComponent({
       };
     }
     const initEditor = async () => {
-      const dom: HTMLElement | null = document.querySelector(
-        `#editor_${props.compId}`
-      );
-      if (!dom) {
+      // const dom: HTMLElement | null = document.querySelector(
+      //   `#editor_${props.compId}`
+      // );
+      if (!editorDomRef.value) {
         return;
       }
-      editorRefVal = await HeadlessEditor.create(dom);
+      editorRefVal = await HeadlessEditor.create(editorDomRef.value);
       editorRefVal.setData(comp.value);
       editorRefVal.focus();
       const range = document.createRange();
-      range.selectNodeContents(dom);
+      range.selectNodeContents(editorDomRef.value);
       const selection = window.getSelection();
       selection?.removeAllRanges();
       selection?.addRange(range);
@@ -209,7 +210,7 @@ const EditorComp = defineComponent({
       });
     });
     return () => {
-      return <div class={textStyle} id={`editor_${props.compId}`}></div>;
+      return <div class={textStyle} ref={editorDomRef} ></div>;
     };
   },
 });