瀏覽代碼

修改bug

huangxw 1 月之前
父節點
當前提交
78bf5d5092
共有 1 個文件被更改,包括 17 次插入11 次删除
  1. 17 11
      src/components/Editor/index.vue

+ 17 - 11
src/components/Editor/index.vue

@@ -8,13 +8,13 @@ import { globalHeaders } from "@/utils/request";
 import { AiEditor } from "aieditor";
 import "aieditor/dist/style.css";
 const divRef = ref();
-let aiEditor: AiEditor | null = null;
+let aiEditor = ref<AiEditor | null>(null);
 const baseUrl = import.meta.env.VITE_APP_BASE_API;
 const uploadFileUrl = ref(baseUrl + '/resource/oss/upload'); // 上
 const headers = ref(globalHeaders());
 const props = defineProps({
     /* 编辑器的内容 */
-    modelValue: propTypes.string,
+    modelValue: propTypes.string.def(''),
     /* 高度 */
     height: propTypes.number.def(400),
     /* 最小高度 */
@@ -29,12 +29,12 @@ const props = defineProps({
 });
 const emit = defineEmits(['update:modelValue']);
 const { proxy } = getCurrentInstance() as ComponentInternalInstance;
-onMounted(() => {
-    aiEditor = new AiEditor({
+const initEditor = () => {
+     aiEditor.value = new AiEditor({
         element: divRef.value as Element,
         placeholder: props.placeholder || '请输入内容',
-        content: props.modelValue || '',
         draggable: true,
+        content: props.modelValue,
         toolbarKeys: ["undo", "redo", "brush", "eraser",
             "|", "heading", "font-family", "font-size",
             "|", "bold", "italic", "underline", "strike", "link", "code", "subscript", "superscript", "hr", "todo", "emoji",
@@ -101,7 +101,7 @@ onMounted(() => {
             uploaderEvent: {
                 onUploadBefore: (file, uploadUrl, headers) => {
                     console.log(file);
-                    
+
                     //监听视频上传之前,此方法可以不用回任何内容,但若返回 false,则终止上传
                     return handleBeforeUpload(file);
                 },
@@ -135,13 +135,19 @@ onMounted(() => {
                 },
             },
         },
-        onChange:(aiEditor)=>{
-        // 监听到用编辑器内容发生变化了,控制台打印编辑器的 html 内容...
-        console.log(aiEditor.getHtml())
-        emit('update:modelValue', aiEditor.getHtml());
-    }
+        onChange: (aiEditor) => {
+            // 监听到用编辑器内容发生变化了,控制台打印编辑器的 html 内容...
+            emit('update:modelValue', aiEditor.getHtml());
+        }
     })
+}
+onMounted(() => {
+    // 等待1s,确保modelValue有值
+    setTimeout(() => {
+        initEditor();
+    }, 1000);
 })
+
 // 图片上传前拦截
 const handleBeforeUpload = (file: any) => {
     const type = ['image/jpeg', 'image/jpg', 'image/png', 'image/svg'];