Nodejs中jade模板如何给文本输出换行符这种东西……
Nodejs中jade模板如何给文本输出换行符这种东西……
搜索了好久，没找到答案，有人说jade不支持。从控制台输出，数据库里存的有 换行符。
但是打倒页面里就没有，用 | ！ #都不行。
目前是输出之前整体给替换成br。但是想想就很傻逼。。。有没有人遇到并解决这个问题的？
Node.js 中 Jade 模板如何给文本输出换行符
问题描述
在使用 Jade 模板引擎时，你可能会遇到这样的问题：文本中的换行符在渲染到页面上后没有生效。尽管你在控制台或数据库中看到文本包含换行符，但在浏览器中显示为单行文本。
解决方案
Jade 模板引擎确实有一些特定的语法来处理这种情况。你可以使用 | 来表示文本行，并通过适当的语法确保换行符被正确解析。以下是一些方法：
-
使用
|和缩进： 在 Jade 中，你可以使用|符号来表示文本行，并且通过适当的缩进来实现换行效果。p | 这是一行文本。 | 这是另一行文本。 -
使用
!=输出 HTML 特殊字符： 如果你需要输出包含 HTML 特殊字符（如<br>）的内容，可以使用!=来输出原始字符串。这将保留原始的 HTML 结构。p!= 文本\n包含换行符 -
预处理字符串： 你也可以在输出之前将文本中的换行符替换为 HTML 的
<br>标签。虽然这种方法可能不如前两种优雅，但有时也是必要的。const jade = require('jade'); const textWithNewlines = '这是第一行。\n这是第二行。'; const html = jade.render(`p ${textWithNewlines.replace(/\n/g, '<br>')}`); console.log(html);
示例代码
假设我们有一个简单的 Jade 模板文件 template.jade：
doctype html
html
body
h1 文本换行示例
p
| 这是一行文本。
| 这是另一行文本。如果你需要动态生成包含换行符的文本，可以在 JavaScript 文件中进行预处理：
const jade = require('jade');
const fs = require('fs');
// 动态生成包含换行符的文本
const textWithNewlines = '这是第一行。\n这是第二行。';
// 渲染 Jade 模板
const html = jade.render(fs.readFileSync('template.jade', 'utf8'), {
text: textWithNewlines.replace(/\n/g, '<br>')
});
console.log(html);通过这些方法，你可以更有效地在 Node.js 和 Jade 模板中处理文本换行符。希望这些解决方案对你有所帮助！
在Node.js中使用Jade模板引擎（现在称为Pug）时，处理文本中的换行符可以通过一些简单的方法来实现。如果你的数据中包含换行符，并且希望在渲染到HTML页面时保留这些换行符，可以利用CSS样式或直接在模板中进行替换。
方法一：使用CSS white-space: pre;
你可以通过CSS设置元素的white-space属性为pre，这样就可以保持文本中的原始空格和换行符。
示例代码
index.pug
style.
.preserve-newline {
white-space: pre;
}
div(class='preserve-newline')
| 这是一段
| 包含换行符
| 的文本方法二：在后端替换换行符为HTML <br>标签
你也可以在将数据传递给Jade模板之前，在服务器端将换行符替换为HTML的<br>标签。
示例代码
server.js
const express = require('express');
const app = express();
app.set('view engine', 'pug');
app.get('/', (req, res) => {
const textWithNewlines = "这是一段\n包含换行符\n的文本";
// 在服务器端替换换行符为<br>
const htmlText = textWithNewlines.replace(/\n/g, '<br>');
res.render('index', { content: htmlText });
});
app.listen(3000, () => console.log('App listening on port 3000!'));index.pug
div!= content以上两种方法都可以实现保留文本中的换行符。选择哪种方法取决于你的具体需求和偏好。第一种方法更符合语义化标准，而第二种方法则是在HTML中直接插入换行标签。
