banner、协议

src/components/ImagePreview/index.vue

@@ -4,7 +4,7 @@
     fit="cover"
     :style="`width:${realWidth};height:${realHeight};`"
     :preview-src-list="realSrcList"
-    append-to-body="true"
+    :preview-teleported="true"
   >
     <template #error>
       <div class="image-slot">
@@ -20,16 +20,16 @@ import { isExternal } from "@/utils/validate";
 const props = defineProps({
   src: {
     type: String,
-    required: true
+    required: true,
   },
   width: {
     type: [Number, String],
-    default: ""
+    default: "",
   },
   height: {
     type: [Number, String],
-    default: ""
-  }
+    default: "",
+  },
 });
 
 const realSrc = computed(() => {
@@ -43,7 +43,7 @@ const realSrc = computed(() => {
 const realSrcList = computed(() => {
   let real_src_list = props.src.split(",");
   let srcList = [];
-  real_src_list.forEach(item => {
+  real_src_list.forEach((item) => {
     if (isExternal(item)) {
       return srcList.push(item);
     }

src/components/WangEditor/index.vue

@@ -19,7 +19,14 @@
 
 <script>
 import "@wangeditor/editor/dist/css/style.css"; // 引入 css
-import { onBeforeUnmount, ref, shallowRef, toRefs, watch } from "vue";
+import {
+  onBeforeUnmount,
+  onMounted,
+  ref,
+  shallowRef,
+  toRefs,
+  watch,
+} from "vue";
 import { Editor, Toolbar } from "@wangeditor/editor-for-vue";
 
 export default {
@@ -49,11 +56,15 @@ export default {
       type: String,
       default: "default",
     },
+    readonly: {
+      type: Boolean,
+      default: false,
+    },
   },
   setup(props, context) {
     // 编辑器实例，必须用 shallowRef
     const editorRef = shallowRef();
-    // console.log(editorRef.value.getAllMenuKeys());
+
     // 内容 HTML
     const valueHtml = ref("");
     watch(
@@ -84,11 +95,15 @@ export default {
       placeholder: "请输入内容...",
       autoFocus: props.focus,
       maxLength: 140,
+      readOnly: props.readonly,
     };
-
+    onMounted(() => {
+      // console.log(editorRef.value.getConfig());
+    });
     // 组件销毁时，也及时销毁编辑器
     onBeforeUnmount(() => {
       const editor = editorRef.value;
+
       if (editor == null) return;
       editor.destroy();
     });