那玉石里的断线呢?

I'm pretty sure that this is a no-brainer but I didn't find any snippet of sample code. What's the best way to insert line breaks (aka the good ol' br/)?

我很确定这是一个无需动脑筋的问题，但我没有找到任何示例代码片段。插入换行符的最佳方式是什么?

As far as I can see if I put a "br" at the beginning of an empty line, it is rendered as <br/> but if I have to show several lines of text, the resulting code is quite verbose:

就我所知，如果我在空行的开头放一个“br”，它会被呈现为
，但如果我要显示几行文本，结果代码就相当冗长:

.poem 
    p 
        | Si chiamava Tatiana, la sorella… 
        br 
        | Noi siamo i primi, almeno lo crediamo
        br 
        | Che un tale nome arditamente nella
        br 
        | Cornice d’un romanzo introduciamo.
        br 
        | E che dunque? E’ piacevole, sonoro.
        br 
        | Lo so che a molti privo di decoro 
        br 
        | Apparirà, già fuori moda, e degno
        br 
        | Piuttosto d’un ancella, certo segno, 
        br 
        | confessiamolo pur senza paura,
        br 
        | di quanto s’è noialtri al gusto avversi
        br 
        | nei nostri nomi (a non parlar di versi). |br
        br 
        | Credemmo conquistare la cultura,
        br 
        | e non ne abbiamo preso, in conclusione,
        br 
        | che la ricerca dell’affettazione.

Is there a better way to solve this? (incidentally I'm asking for the same thing with the image tag...)

有更好的方法来解决这个问题吗?(顺便说一句，我也想要图像标签……)

9 个解决方案

#1

The cleanest and easiest solution is to use the style attribute white-space: pre; eg:

最干净、最简单的解决方案是使用style属性white-space: pre;例如:

.poem 
    p(style='white-space:pre;')
        | Si chiamava Tatiana, la sorella… 
        | Noi siamo i primi, almeno lo crediamo
        | Che un tale nome arditamente nella
        | Cornice d’un romanzo introduciamo.
        | E che dunque? E’ piacevole, sonoro.
        | Lo so che a molti privo di decoro 
        | Apparirà, già fuori moda, e degno
        | Piuttosto d’un ancella, certo segno, 
        | confessiamolo pur senza paura,
        | di quanto s’è noialtri al gusto avversi
        | nei nostri nomi (a non parlar di versi). |br
        | Credemmo conquistare la cultura,
        | e non ne abbiamo preso, in conclusione,
        | che la ricerca dell’affettazione.

#2

I figured it out. Just go ahead and throw a good ol' fashioned <br /> tag in there. You'll be golden : )

我想出来。继续，在那里扔一个好的ol' style
标签。你会是金的

p
 |hey this is my <br />
 |broken paragraph!

UPDATE: Jade now supports using just br for line breaks.

更新:Jade现在支持对换行使用br。

#3

so that you're aware.. if you're pulling this information.. say from an SQL database where you've already manually entered in line breaks (say in a textarea of a form) you can do the following on the server to your output

所以你知道. .如果你在提取这个信息。假设您已经手工输入了换行符(比如在表单的textarea中)的SQL数据库中，您可以在服务器上对输出执行以下操作

var contentParse = function(content){
    content = content.replace(/\n?\r\n/g, '<br />' );
    return content;
};

and then in jade use

然后是玉的使用

!{content}

the ! lets jade know that you're inserting raw html into the variable you're trying to render out

!让jade知道，您正在将原始html插入到要呈现的变量中

source: https://github.com/visionmedia/jade#tag-text

来源:https://github.com/visionmedia/jade #标签文本

#4

robustly with a div per line:

每行都有一个div:

p.poem 
  .line Si chiamava Tatiana, la sorella… 
  .line Noi siamo i primi, almeno lo crediamo
  .line Che un tale nome arditamente nella
  .line Cornice d’un romanzo introduciamo.
  .line E che dunque? E’ piacevole, sonoro.
  .line Lo so che a molti privo di decoro 
  .line Apparirà, già fuori moda, e degno
  .line Piuttosto d’un ancella, certo segno, 
  .line confessiamolo pur senza paura,
  .line di quanto s’è noialtri al gusto avversi
  .line nei nostri nomi (a non parlar di versi).
  .line Credemmo conquistare la cultura,
  .line e non ne abbiamo preso, in conclusione,
  .line che la ricerca dell’affettazione.

or simply with a pre:

或者简单地加上一个pre:

style pre.poem { font-family:ariel }

以前的风格。诗{字体类型:爱丽儿}

pre.poem 
  Si chiamava Tatiana, la sorella… 
  Noi siamo i primi, almeno lo crediamo
  Che un tale nome arditamente nella
  Cornice d’un romanzo introduciamo.
  E che dunque? E’ piacevole, sonoro.
  Lo so che a molti privo di decoro 
  Apparirà, già fuori moda, e degno
  Piuttosto d’un ancella, certo segno, 
  confessiamolo pur senza paura,
  di quanto s’è noialtri al gusto avversi
  nei nostri nomi (a non parlar di versi). 
  Credemmo conquistare la cultura,
  e non ne abbiamo preso, in conclusione,
  che la ricerca dell’affettazione.

#5

This doesn't seem to be an answer, so:

这似乎不是一个答案，所以:

You can also do it by adding inline br tags using Jade/Pug's inline tag format, e.g.:

您还可以使用Jade/Pug的内联标签格式添加内联br标签，例如:

p.
    Some text on the first line.#[br]
    Some text on the second line.

Produces:

生产:

  <p>Some text on the first line.<br>
    Some text on the second line.
  </p>

#6

I was able to do the following after @haxxxton

@haxxxton之后，我可以执行以下操作

app.use(function(req, res, next){
  var contentParse = function (content){
      content = content.replace(/\n?\r\n/g, '<br />' );
      return content;
  };
  res.locals.contentParse = contentParse;
  next();
});

For example, it can be used in a jade template using the function p!= contentParse(post.description)

例如，它可以使用函数p在玉模板中使用!= contentParse(post.description)

#7

Just in case you have not used the year filter on the first search: How to add br tag with Jade HTML

以防您还没有在第一次搜索中使用年度过滤器:如何使用Jade HTML添加br标记

Put the text on a new line with a preceding |:

使用前面的|将文本放在新行:

p first line
br
| second line

#8

this also works well.

这同样适用。

div
   pre
      | this is line 1
      | this is line 2

#9

-2

Try this:

试试这个:

- for(var i = 0; i < 10; i++)
    | hello
    | world

#1