vue v-html 常见问题

后台添加的一段有换行的文本,到前台显示的时候不换行了;一般有三种方法来处理。

如果文本是类似以下这样的文本,换行之后的文字每行都不是很多,可以使用pre标签或者css设置‘white-space: pre’都会引起长文本不换行的问题。

这是一段短文本<br>这是一段短文本<br>这是一段短文本
<pre v-html=""></pre>

如果其中有长文本,类似如下的,可以使用下面的方法

这是一段比较长的文本,它超过了手机屏幕的宽度它超过了手机屏幕的宽度它超过了手机屏幕的宽度<br>这是一段短文本<br>这是一段短文本
<div v-html="item.description.replace(/\n/g, '<br>')"></div>

Revisions

  • 2019年1月26日 @ 22:08:55 [当前版本] by Bruce
  • 2019年1月26日 @ 22:08:55 by Tony

Revision Differences

There are no differences between the 2019年1月26日 @ 22:08:55 revision and the current revision. (Maybe only post meta information was changed.)

Comments are closed.