4种前端处理文本换行展示
序:
后端传递了一大段包含了回车符的文本内容,前端展示的时候所有文字堆在一起,没有换行展示。以下方法中content为后端返回的文本内容
方法一:
“↵”符号在html中会识别别为\r,
等转义字符,所以我们可以使用\r
去替换(.replace(/(\r
|
|\r)/gm, ’
‘))
存在英文****不显示
<div v-html="content.replace(/(\r
|
|\r)/gm, '
')"></div>
方法二:
使用
标签, 它会自动识别和处理后台返回的换行符号
<pre>{
{content }}</pre>
方法三:
white-space样式