Markdown 转 React 组件
在线将 Markdown 转换为 React 组件。生成包含 dangerouslySetInnerHTML 和 DOMPurify 的即用型 TSX 组件。即时复制或下载。
将 .md 文件拖放到此处，或点击选择
支持多个文件
生成一个 React 函数组件，使用 marked 和 DOMPurify 将 Markdown 渲染为 HTML。包含 'use client' 指令、类型化导入和使用注释——可直接粘贴到任何 React 或 Next.js 项目中。
免费 Markdown 转换器 — HTML、PDF、Word、Slack、React
基于浏览器的 Markdown 转换器，无需上传文件，即可将 .md 文件转换为 HTML、Word 文档、Slack 消息、React 组件或可打印的 PDF。
Markdown 转 HTML
转换为语义化 HTML5，提供完整文档或原始片段，并进行适当的安全处理。
Markdown 转 PDF
使用浏览器原生打印引擎导出打印质量的 A4 PDF。
Markdown 转 Word
下载可在 Microsoft Word、Google Docs 和 LibreOffice 中打开的 .doc 文件。
Markdown 转 Slack
转换为 Slack 的 mrkdwn 格式：*粗体*、_斜体_、~删除线~、<链接|文字>。
Markdown 转 React
生成包含 dangerouslySetInnerHTML 和 DOMPurify 的即用型 React 组件。
批量转换
上传多个 .md 文件，一次性下载所有转换后的文件（ZIP 格式）。
如何转换 Markdown
- 1
在输入区域粘贴 Markdown，或切换到批量模式上传多个 .md 文件。
- 2
选择输出格式：HTML、PDF、Word、Slack 或 React。
- 3
点击「转换并下载」——文件会立即下载到您的设备。
常见问题
组件使用哪些库？
marked 用于 Markdown 解析，DOMPurify 用于 XSS 安全处理。安装命令：npm install marked dompurify @types/dompurify
dangerouslySetInnerHTML 安全吗？
是的，因为 HTML 在渲染前经过 DOMPurify 安全处理，消除了 XSS 向量。这是 React 中动态 HTML 的标准安全模式。
它兼容 Next.js 吗？
是的。组件包含 'use client' 指令，因为 DOMPurify 需要浏览器环境。适用于任何 React 18+ 或 Next.js 13+ 项目。