vue文本识别 “ \n ” 的换行问题

在 vue 项目，有时请求返回的数据 res.data 中会有含有 \n 的字符串，如果直接渲染的话无法实现换行。

解决方法：

一、通过 css属性 实现

即：设置 white-space: pre-wrap;，（代码如下）：

<div style="white-space: pre-wrap;">{{请求返回的含有\n的字符串}}</div>

二、使用v-html实现

首先，将字符串里的 \n 替换为 <br>，然后用 v-html 指令渲染字符串为 innerHTML 。
部分代码如下：

// JS部分
this.text = res.data.replace(/\n/g,'<br>')

// HTML部分
<div v-html="text"></div>