vue中处理文本不换行问题

vue中文本换行问题:

一段文字（比如叫test），可能包含\n，
1,如果用{{text}}直接显示，不会换行。
2,直接用v-html=“text”,也不会换行。

第一种解决方法：

//js部分  在main.js中加以下代码
Vue.prototype.formatWord = function (val) {
  return val.replace(/\n/g, '<br>')
},
//html部分
<div v-html="formatWord(test)"></div>

第二种解决方法：

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

//html部分
<div>{{text}}</div>