利用div属性dangerousSetInnerHTML,实现将接口返回标签元素嵌入到div中,或解决‘\n’不换行问题

接口返回内容如下时可以使用:

1 如果返回的数据中有\n 进行处理,用<br/>替换

eg:const info = 'React\n Vue\n Angular';

const replaceInfo = info.replace(/\\n/g, '<br/>);

2 在JSX中,配合dangerousSetInnerHTML实现换行,设置css属性:white-space:pre-wrap

<div style={{whiteSpace: 'pre-wrap'}} dangerousSetInnerHTML={{__html: replaceInfo}}>

posted @ 2022-06-17 14:21  天官赐福·  阅读(733)  评论(0编辑  收藏  举报
返回顶端