md editor v3

? MD-editor-V3

Bahasa Inggris | 中文

Editor Markdown untuk VUE3, dikembangkan dalam jsx dan typescript .

• Dokumentasi dan Contoh: Pergi

• Editor seri yang sama untuk React: MD-Editor-RT

️ fitur

• Toolbar, screenfull atau screenfull di halaman web dan sebagainya.
• Tema, tema default dan gelap bawaan.
• Kunci pintas untuk editor.
• Percantik konten Anda dengan prettier (hanya untuk konten penurunan harga, bukan kode dan teks lainnya).
• Multi-bahasa, build-in China dan Inggris (default: Cina).
• Unggah gambar, tempel atau klip gambar dan unggah.
• Artikel Render secara langsung (tidak ada editor, tidak ada pendengar acara, hanya pratinjau konten).
• Tema pratinjau, default , vuepress , github , cyanosis , mk-cute , gaya smart-blue (tidak identik). Itu dapat disesuaikan juga (lihat halaman contoh).
• mermaid (> = 1.8.0), formula matematika katex (> = 1.9.0).
• Kustomisasi toolbar sesuka Anda.
• Impor sesuai permintaan (> = 4.0.0).

? Pratinjau

Tema default	Tema Gelap	Pratinjau saja

Memasukkan prompt dan tanda, ekstensi emoji

? Memasang

yarn add md-editor-v3

Gunakan perpanjangan bahasa dan tema yang ada, seperti orang Jepang

yarn add @vavt/cm-extension

Gunakan komponen bilah alat yang ada, seperti mengekspor konten sebagai pdf

yarn add @vavt/v3-extension

Untuk lebih banyak cara menggunakan atau berkontribusi, silakan merujuk ke: MD-editor-Extension

Penggunaan

Saat menggunakan rendering sisi server, pastikan untuk mengatur editorId ke nilai konstan.

Mulai dari 4.0.0 , komponen internal dapat diimpor sesuai permintaan.

✍? Editor tampilan

< 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 >

Pratinjau saja

< 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 >

Saat menggunakan rendering sisi server, scrollElement harus dari tipe string, misalnya: html , body , #id , .class .

---

Untuk penggunaan lebih lanjut, silakan kunjungi dokumennya.