情景复现:
解决办法,添加样式进行限制
/* index.css */
.markdown-container {
word-break: break-word; /* 强制长单词断行 */
white-space: pre-wrap; /* 保留空白符序列,但是正常地进行换行 */
overflow-wrap: break-word; /* 在长单词或 URL 地址内部进行换行 */
}
// tsx文件内
<ReactMarkdown className={"markdown-container"} remarkPlugins={[remarkGfm]}>
{text}
</ReactMarkdown>
添加样式后,即可解决问题,如下图所示:
本站资源均来自互联网,仅供研究学习,禁止违法使用和商用,产生法律纠纷本站概不负责!如果侵犯了您的权益请与我们联系!
转载请注明出处: 免费源码网-免费的源码资源网站 » react-markdown内容宽度溢出和换行不生效问题
发表评论 取消回复