思路：实现文本换行有两种方法，一是HTML方法，即<br>标签；二是CSS方法，即white-space属性。

方法1. 使用v-html

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

// JS部分
this.text = res.data.replace(/\n/g, '<br>')
// HTML部分
<div v-html="text"></div>

这种方法比较麻烦，而且存在安全问题，故不推荐使用。

方法2. 设置white-space属性 （推荐）

将div容器的white-space属性设置为pre-wrap即可解决问题。

// CSS部分
.text-wrapper {
  white-space: pre-wrap;
}

// HTML部分
<div class="text-wrapper">{{text}}</div>

pre-wrap值的意思是保留空白并且正常换行。

white-space各属性值详见 这里 。其实设置为pre即可使换行符发挥作用，但这时文本在div宽度不足时不会自动换行，而是撞破边界延伸到div外部去，所以还得加上wrap。