vue中{{}} 如何解析出textarea换行符

问题：

vue中,将textarea进行v-model绑定后，在使用{{}} 显示时，换行不生效，直接显示成空格

 
代码：

<div>
        {{summary}}
</div>
<textarea v-model="summary" cols="30" rows="10"></textarea>

 
 

解决方案：

在展示的div添加样式

.pre-line {
white-space: pre-line;
}

 
修改后代码：

<div  class="pre-line">
        {{summary}}
</div>
<textarea v-model="summary" cols="30" rows="10"></textarea>

 

作者：doubleyong

博客：bugshouji.com (专门解决与收集bug的网站)

 

欢迎添加下面的 “公众号” ，可以第一时间获到文章推送 @_@