解决倒引号字符串内\n换行失败的问题

示例代码如下：

<div class="resultArea">
   <div>{{str}}</div>
</div>

str += `每人公共区域费用：${difference}÷${this.tableData.length}=${perPeopleFree}（元）\n`;

如果该段代码拼成的字符串str需要显示，\n在显示时不换行。解决方法：

加上

.resultArea{
  /* 字符串换行 */
  white-space:pre-wrap;
}

即可解决问题。

white-space 属性设置如何处理元素内的空白。

默认是normal，空白会被浏览器忽略。

pre-wrap：保留空白符序列，但是正常地进行换行。

pre是preserve（保留）的意思。