md editor rt
v5.1.1
ภาษาอังกฤษ | 中文
ตัวแก้ไข Markdown สำหรับ react พัฒนาใน jsx และ typescript
เอกสารและการสาธิต: ไป
ตัวแก้ไขซีรี่ส์เดียวกันสำหรับ Vue3: MD-editor-V3
prettier (เฉพาะสำหรับเนื้อหา Markdown ไม่ใช่รหัสและข้อความอื่น ๆ )default , vuepress , github , cyanosis , mk-cute , สไตล์ smart-blue (ไม่เหมือนกัน) สามารถปรับแต่งได้ (ดูหน้าตัวอย่าง)mermaid (> = 1.3.0), สูตรคณิตศาสตร์ katex (> = 1.4.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 } />
</ >
) ;
} ; เมื่อใช้การเรนเดอร์ฝั่งเซิร์ฟเวอร์ scrollElement ควรเป็นประเภทสตริงเช่น: html , body , #id , .class
สำหรับการใช้งานเพิ่มเติมกรุณาเยี่ยมชมเอกสาร