vue识别\n换行
在项目中，需要渲染字符串文本，文本中需要通过\n换行， 如果直接渲染的话无法识别\n实现换行。
下面提供两种方式实现换行
1. 使用v-html渲染。
通过正则将字符串中\n转换成v-html可以识别的标签<br />，再通过v-html渲染。<div v-html="text"></div>this.text = str.replace(/\n/g,'<br />')2. 通过css实现
<div style="white-space: pre-wrap;">{{text}}</div>white-space属性值
| 值 | 描述 |
|---|---|
| normal | 默认。空白会被浏览器忽略。 |
| pre | 空白会被浏览器保留。其行为方式类似 HTML 中的 <pre> 标签。 |
| nowrap | 文本不会换行，文本会在在同一行上继续，直到遇到 <br> 标签为止。 |
| pre-wrap | 保留空白符序列，但是正常地进行换行。 |
| pre-line | 合并空白符序列，但是保留换行符。 |
| inherit | 规定应该从父元素继承white-space属性的值。 |
原文链接：https://blog.csdn.net/qq_42529835/article/details/130317984
0 人喜欢
暂无评论，来发布第一条评论吧！
弦圈热门内容
center h1 in the middle of screen（示例提问）
How can I center horizontally and vertically a text? I don't want to use position absolute because I try with it and my other div getting worse. Is there another way to do that ?div { height: 400px; width: 800px; background: red; }<div> <h1>This is title</h1> </div>
基础数学几何方向应该如何学习？
前辈们好，本人是一名大二数学系学生，目前大致了解点集拓扑基本概念（但还没怎么做题），代数拓扑看过基本群和同伦型，复变和抽代这学期正在学。之所以问这个问题是因为之前看到中科大梁永祺老师的主页看到了这样一句话：让我感觉非常奇妙，也想见识一下这精华的部分（希望在大四毕业前能做到吧！😭），也激发了我学习代数与几何方向的想法。其中代数方向其实学习路径了解的差不多了，大致就是学完抽象代数后同调、交换和lie代数都可以学了，但几何方向还不甚了解，很多几何方向的课学校都是大三大四才有，甚至开不出来，因此只能自行学习。这个问题其实之前也问了不少前辈，但发现每个人的学习路径（有的是从微分几何上同调那边学，有的是先接触的代数拓扑等）都不一样，而几何方向又十分繁杂，理不清学习顺序，手头上有很多纸质书、电子书、网课等也无从下手；或者有些内容可能比较难且深入某个具体方向，以后不做这个方向可能根本不会用到，不知道该学多少合适。所以想多听取一点建议以便自己之后逐一尝试，例如：学习路径、参考书目、课程视频等等。谢谢各位！😘