md editor rtダウンロード-MD md editor rtソースコードダウンロード

md editor rt

その他のリソース

v5.1.1

ダウンロード

？ MD-EDITOR-RT

英語| 中文

jsxおよびtypescriptで開発されたreactのMarkdownエディター。

ドキュメントとデモ：go
VUE3の同じシリーズエディター：MD-Editor-V3

§機能

Webページのツールバー、スクリーンフルまたはスクリーンフルなど。
テーマ、組み込みのデフォルトおよび暗いテーマ。
編集者のショートカットキー。
prettierにコンテンツを美化します（マークダウンコンテンツのみ、コードやその他のテキストではありません）。
多言語、中国語と英語のビルド（デフォルト：中国語）。
画像をアップロードし、貼り付け、またはクリップをクリップしてアップロードします。
記事を直接レンダリングします（編集者なし、イベントリスナーなし、コンテンツのみをプレビューします）。
プレビュー、 default 、 vuepress 、 github 、 cyanosis 、 mk-cute 、 smart-blueスタイルのテーマ（同一ではありません）。カスタマイズすることもできます（例を参照）。
mermaid （> = 1.3.0）、 katex Mathematical Formula> = 1.4.0
好きなようにツールバーをカスタマイズします。
オンデマンドインポート（> = 4.0.0）。

？プレビュー

デフォルトのテーマ	暗いテーマ	プレビューのみ

入力プロンプトとマーク、絵文字拡張機能

？インストール

yarn add md-editor-rt

日本などの言語とテーマの既存の拡張を使用する

yarn add @vavt/cm-extension

PDFとしてコンテンツのエクスポートなど、ツールバーの既存のコンポーネントを使用します

yarn add @vavt/v3-extension

使用または貢献するその他の方法については、MD-Editor-Extensionを参照してください

使用法

4.0.0から、内部コンポーネントはオンデマンドでインポートできます。

✍？？ディスプレイエディター

 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 } /> ;
} ;

プレビューのみ

 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 } />
    </ >
  ) ;
} ;