用途
Syncfusion Markdown Converter 是一个轻量级工具，用于把 Markdown 格式的文本转换成干净、语义化的 HTML。它通常与 Syncfusion React 富文本编辑器（RichTextEditorComponent）的 Markdown 编辑模式一起使用，为渲染后的内容提供实时预览。
适用场景
- 在 React 应用中将 Markdown 文本转换为 HTML
- 在用户输入时实时预览 Markdown 内容
- 配置转换行为（GFM 支持、换行、异步模式、错误抑制）
- 在 Markdown 模式下使用 RichTextEditorComponent 构建带 HTML 预览的 Markdown 编辑器
- 将 MarkdownConverter.toHtml() 与 Syncfusion React 富文本编辑器集成
安装与准备
安装依赖包：
npm install @syncfusion/ej2-markdown-converter npm install @syncfusion/ej2-react-richtexteditor
在 src/styles.css 中导入 CSS（material3 主题）：
@import '../node_modules/@syncfusion/ej2-base/styles/material3.css'; @import '../node_modules/@syncfusion/ej2-richtexteditor/styles/material3.css';
在 React 项目中还涉及项目创建（Vite / CRA）、模块注入（MarkdownEditor、Toolbar、Image、Link、Table）以及运行应用等步骤。
主要能力
转换 Markdown 为 HTML — toHtml API
- MarkdownConverter.toHtml() 方法签名
- 基本用法示例（可独立使用，无需编辑器）
- 支持的 Markdown 元素（标题、列表、表格、链接、图片、行内样式）
- 将返回值配合 dangerouslySetInnerHTML 使用
基本示例：
import { MarkdownConverter } from '@syncfusion/ej2-markdown-converter';
const markdown = '# Hello World\nThis is Markdown text.'; const html = MarkdownConverter.toHtml(markdown); console.log(html); // 输出: <h1>Hello World</h1><p>This is <strong>Markdown</strong> text.</p>
可配置选项（MarkdownConverterOptions）
- async — 面向大内容的异步转换（默认 false）
- gfm — 支持 GitHub Flavored Markdown（默认 true）
- lineBreak — 将单个换行转换为 <br>（默认 false）
- silence — 抑制无效 Markdown 引发的错误（默认 false）
传入选项的完整示例：
const html = MarkdownConverter.toHtml(markdownString, { gfm: false, lineBreak: true });
富文本编辑器集成
- 使用 editorMode="Markdown" 进入 Markdown 模式
- 通过 created、change、actionComplete 事件实现实时预览
- Markdown 编辑的工具栏配置
- 使用 MarkdownFormatter 自定义 Markdown 语法
- 自定义预览切换按钮（完整预览模式）
- 带预览切换的完整可用示例
使用方式（常见模式）
模式一：独立转换（无编辑器）
import { MarkdownConverter } from '@syncfusion/ej2-markdown-converter';
const html = MarkdownConverter.toHtml(markdownString); document.getElementById('preview')!.innerHTML = html as string;
模式二：按键实时预览（在富文本编辑器文本区中每次按键时转换）
const markdownConversion = () => { if (mdsource?.classList.contains('e-active')) { const htmlPreview = rteObj.element.querySelector('#' + rteObj.getID() + 'html-view') as HTMLElement; htmlPreview.innerHTML = MarkdownConverter.toHtml( (rteObj.contentModule.getEditPanel() as HTMLTextAreaElement).value ) as string; } };
模式三：带选项转换（关闭 GFM 并启用换行转换，见上文示例）。
模式四：使用 Splitter 实现并排预览。若需要完整的编辑器加预览体验，可配合 Syncfusion Splitter 组件与 Markdown 模式的富文本编辑器使用。预览面板在每次 change 事件时通过 updateValue() 更新。完整实现可参阅 references/richtexteditor-integration.md。
关键 API
- MarkdownConverter.toHtml(content, options?)：静态方法，将 Markdown 字符串转换为 HTML
- options.async：boolean，默认 false，面向大内容的异步转换
- options.gfm：boolean，默认 true，GitHub Flavored Markdown 支持
- options.lineBreak：boolean，默认 false，单换行转换为 <br>
- options.silence：boolean，默认 false，抑制无效 Markdown 的错误
限制
资料未提供关于浏览器兼容性、性能上限、收费或价格、以及转换完整度的更多细节，暂未提供相关内容。