React实现文本markdownit形式

1.项目组件中引用

复制代码
import markdownit from 'markdown-it';

2.运用到函数中

复制代码
const InterviewReportModal = ({ ResumeDetail }) => {
  const md = markdownit({ html: true, breaks: true });
}

export default InterviewReportModal;

3.运用到DOM中

html 复制代码
<div dangerouslySetInnerHTML={{ __html: md.render(ResumeDetail?.summaryReport || "") }} />

将数据中的summaryReport以markdownit形式显示

最终效果图:

相关推荐
AC赳赳老秦7 小时前
CSDN 技术社区数据采集:OpenClaw 抓取公开技术热帖,生成领域技术热点周报
java·大数据·前端·数据库·python·php·openclaw
结网的兔子8 小时前
【前端开发】Web端迁移至 uni-app 及鸿蒙扩展方案对比
前端·uni-app·harmonyos
水瓶夜之8 小时前
.NET 中的新增功能系列文章——.NET SDK中的新增功能
前端·chrome·.net
笨笨狗吞噬者8 小时前
VS Code 内置浏览器打开网页
前端
SamChan909 小时前
WebSocket实现PDF翻译进度实时推送:Go后端+React前端的完整方案
前端·websocket·pdf·c#·react·机器翻译
甲维斯9 小时前
DeepSeekFlash前端依旧拉垮,而且变慢了很多!
前端·人工智能
奈斯先生Vector9 小时前
大模型 Agentic Workflow 架构解构:异构 API 调度与 Token 路由的多模态系统设计
开发语言·前端·架构·prompt·aigc·音视频
海带紫菜菠萝汤9 小时前
FFmpeg.wasm 实践:在浏览器中运行 FFmpeg 的能力边界与性能瓶颈
前端·javascript·ffmpeg·音视频·wasm
名字还没想好☜9 小时前
React 受控输入框光标跳到末尾:格式化输入时的 selection 丢失 bug 与修复
前端·javascript·react.js·bug·react·next.js
Access开发易登软件9 小时前
Access 怎么做前后端分离?用 Web API 读写 SQL Server
前端·数据库·人工智能·microsoft·excel·access