dangerouslySetInnerHTML空格不换行解决方案
上次我们说到dangerouslySetInnerHTML可以渲染文本内容,但是文本里要是有换行时,展示的页面并不会做自动换行,这时就要我们进行数据处理一下,使用正则替换换行符改成能别识别的
,代码如下:
第一种,替换全部的换行符
{
/* eslint-disable */
<div
className="email-content"
dangerouslySetInnerHTML={{
__html: bcContent?.content.replace('\n','<br/>')
}}
/>
/* eslint-enable */
}
第二种,替换第一个的换行符
{
/* eslint-disable */
<div
className="email-content"
dangerouslySetInnerHTML={{
__html: bcContent?.content.replace(/[\n]/g,'<br/>')
}}
/>
/* eslint-enable */
}