feat：添加编辑框

Yi.BBS.Vue3/src/components/MavonEdit.vue

@@ -0,0 +1,52 @@
+<template>
+  <mavon-editor
+    previewBackground="#ffffff"
+    v-model="content"
+    ref="md"
+    @imgAdd="imgAdd"
+    @change="change"
+    :ishljs="true"
+    codeStyle="atelier-cave-dark"
+    :style="{'height': props.height+'px', 'z-index': props.z-index}"
+    :externalLink="externalLink"
+  />
+</template>
+  <script setup>
+import { mavonEditor } from "mavon-editor";
+import "mavon-editor/dist/css/index.css";
+import axios from "axios";
+import { ref } from "vue";
+const props = defineProps(["text", "height",'z-index']);
+const content = ref("");
+const externalLink = {
+  markdown_css: function () {
+    // 这是你的markdown css文件路径
+    return "/mavon-editor/markdown/github-markdown.min.css";
+  },
+  hljs_js: function () {
+    // 这是你的hljs文件路径
+    return "/mavon-editor/highlightjs/highlight.min.js";
+  },
+  hljs_css: function (css) {
+    // 这是你的代码高亮配色文件路径
+    return "/mavon-editor/highlightjs/styles/" + css + ".min.css";
+  },
+  hljs_lang: function (lang) {
+    // 这是你的代码高亮语言解析路径
+    return "/highlightjs/languages/" + lang + ".min.js";
+  },
+  katex_css: function () {
+    // 这是你的katex配色方案路径路径
+    return "/mavon-editor/katex/katex.min.css";
+  },
+  katex_js: function () {
+    // 这是你的katex.js路径
+    return "/mavon-editor/katex/katex.min.js";
+  },
+};
+
+const imgAdd = (pos, file) => {};
+const change = (value, render) => {
+  this.myhtml2 = value;
+};
+</script>

Yi.BBS.Vue3/src/views/AddArticle.vue

@@ -12,7 +12,9 @@
       <el-input placeholder="请输入" />
     </el-form-item>
     <el-form-item label="内容：">
-      <el-input placeholder="请输入" />
+    
+<MavonEdit />
+
     </el-form-item>
     <el-form-item label="分面：">
       <el-input placeholder="请输入" />
@@ -24,6 +26,10 @@
     </el-form>
   </div>
 </template>
+<script setup>
+import MavonEdit from '@/components/MavonEdit.vue'
+
+</script>
 <style scoped>
 .submit-btn
 {