textarea中输入多个空格或者换行时只显示一个空格的解决办法

最近在做一个类似留言板的功能，用户点击评论按钮时出现输入框（textarea），输入文本后点击发布会直接把输入框绑定的值（v-model）传给后端保存，再从后端取出来。
在输入多个空格/多个空白行的情况下，前端读/取都是直接以html形式的字符串实现的，也就是说无论多少个连贯的空格/空白行，都只会在展示该文本的元素内显示为一个空格。
查了一下解决办法：在包裹该展示内容的标签上加上属性“white-space: pre-wrap”即可。

此外还有以下三种方法都可以解决这类问题：

1) 使用转义字符，如" "等，代替手动输入的空格
2）使用全角空格，全角空格被解析为汉字处理
3）使用pre标签包裹文字