الصفحة الرئيسية>موارد بناء الموقع>موارد أخرى
تنزيل

؟ MD-Editor-V3

الإنجليزية | 中文

محرر Markdown لـ Vue3 ، تم تطويره في jsx و typescript .

  • الوثائق والمثال: اذهب

  • محرر السلسلة نفسه لـ React: MD-Editor-RT

️ الميزات

  • شريط الأدوات ، screenfull أو screenfull في صفحات الويب وما إلى ذلك.
  • الموضوعات ، والمضمنة في السداد والظلام.
  • مفتاح الاختصار للمحرر.
  • قم بتجميل المحتوى الخاص بك بواسطة prettier (فقط لمحتوى تخفيض الطلب ، وليس الكود والنص الآخر).
  • متعدد اللغات ، البناء الصيني والإنجليزية (الافتراضي: الصينية).
  • قم بتحميل الصورة أو لصق الصورة أو قصها وتحميلها.
  • قم بإعداد المقالة مباشرة (لا يوجد محرر ، لا مستمع حدث ، فقط معاينة للمحتوى).
  • موضوع المعاينة ، default ، vuepress ، github ، cyanosis ، mk-cute ، أنماط smart-blue (ليست متطابقة). يمكن تخصيصه أيضًا (ارجع إلى صفحة المثال).
  • mermaid (> = 1.8.0) ، صيغة katex الرياضية (> = 1.9.0).
  • تخصيص شريط الأدوات كما تريد.
  • استيراد عند الطلب (> = 4.0.0).

؟ معاينة

الموضوع الافتراضي موضوع مظلم معاينة فقط

إدخال موجه وعلامة ، امتدادات الرموز التعبيرية

؟ ثَبَّتَ 

yarn add md-editor-v3

استخدم الامتداد الحالي للغة والموضوع ، مثل اليابانية 

yarn add @vavt/cm-extension

استخدم مكونات شريط الأدوات الحالية ، مثل تصدير المحتوى مثل PDF 

yarn add @vavt/v3-extension

لمزيد من الطرق للاستخدام أو المساهمة ، يرجى الرجوع إلى: MD-Editor-Extension

الاستخدام

عند استخدام عرض من جانب الخادم ، تأكد من تعيين editorId على قيمة ثابتة.

بدءًا من 4.0.0 ، يمكن استيراد المكونات الداخلية عند الطلب.

✍؟ محرر العرض 

< template >
  < MdEditor v-model = " text " />
</ template >

< script setup>
import { ref } from ' vue ' ;
import { MdEditor } from ' md-editor-v3 ' ;
import ' md-editor-v3/lib/style.css ' ;

const text = ref ( ' # Hello Editor ' );
</ script >

معاينة فقط 

< template >
  < MdPreview :id = " id " :modelValue = " text " />
  < MdCatalog :editorId = " id " :scrollElement = " scrollElement " />
</ template >

< script setup>
import { ref } from ' vue ' ;
import { MdPreview , MdCatalog } from ' md-editor-v3 ' ;
import ' md-editor-v3/lib/preview.css ' ;

const id = ' preview-only ' ;
const text = ref ( ' # Hello Editor ' );
const scrollElement = document . documentElement ;
</ script >

عند استخدام عرض جانب الخادم ، يجب أن يكون scrollElement من نوع السلسلة ، على سبيل المثال: html ، body ، #id ، .class .

لمزيد من الاستخدام ، يرجى زيارة الوثيقة.

يوسع
معلومات إضافية
تطبيقات ذات صلة
نوصي لك
أخبار ذات صلة الكل