md editor rt Download - md editor rt Quellcode Download

md editor rt

Andere Ressourcen

v5.1.1

Herunterladen

? md-editor-rt

Englisch | 中文

Markdown -Editor für react , entwickelt in jsx und typescript .

Dokumentation und Demo: Go
Der gleiche Serien-Editor für VUE3: MD-EDITOR-V3

️ Funktionen

Symbolleiste, Screenfull oder Screenfull in Webseiten usw.
Themen, eingebaute Standard- und dunkle Themen.
Kurzschlussschlüssel für den Herausgeber.
Verschönern Sie Ihren Inhalt mit prettier (nur für Markdown -Inhalte, nicht für den Code und andere Text).
Multisprachiger, eingebauter Chinesisch und Englisch (Standard: Chinesisch).
Laden Sie das Bild hoch, fügen Sie das Bild ein oder klappen Sie es hoch und laden Sie es hoch.
Artikel direkt rendern (kein Editor, kein Event -Listener, nur Vorschau -Inhalt).
Thema Vorschau, default , vuepress , github , cyanosis , mk-cute , smart-blue Stile (nicht identisch). Es kann auch angepasst werden (siehe Beispielseite).
mermaid (> = 1.3.0), katex mathematische Formel （> = 1.4.0）.
Passen Sie die Symbolleiste an, wie Sie möchten.
On-Demand-Import (> = 4.0.0).

? Vorschau

Standardthema	Dunkles Thema	Nur Vorschau

Eingabeaufforderung und Marke, Emoji -Erweiterungen

? Installieren

yarn add md-editor-rt

Verwenden Sie die vorhandene Erweiterung von Sprache und Thema, wie zum Beispiel Japanisch

yarn add @vavt/cm-extension

Verwenden Sie vorhandene Komponenten der Symbolleiste, z. B. den Exportieren von Inhalten als PDF

yarn add @vavt/v3-extension

Weitere Möglichkeiten, um zu verwenden oder einen Beitrag zu leisten, finden Sie unter: MD-Editor-Extension

Verwendung

Ab 4.0.0 können interne Komponenten auf Nachfrage importiert werden.

✍? Editor anzeigen

 import React , { useState } from 'react' ;
import { MdEditor } from 'md-editor-rt' ;
import 'md-editor-rt/lib/style.css' ;

export default ( ) => {
  const [ text , setText ] = useState ( '# Hello Editor' ) ;
  return < MdEditor modelValue = { text } onChange = { setText } /> ;
} ;

Nur Vorschau

 import React , { useState } from 'react' ;
import { MdPreview , MdCatalog } from 'md-editor-rt' ;
import 'md-editor-rt/lib/preview.css' ;

const scrollElement = document . documentElement ;

export default ( ) => {
  const [ text ] = useState ( '# Hello Editor' ) ;
  const [ id ] = useState ( 'preview-only' ) ;

  return (
    < >
      < MdPreview id = { id } modelValue = { text } />
      < MdCatalog editorId = { id } scrollElement = { scrollElement } />
    </ >
  ) ;
} ;