What about Line Breaks in Jade?

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:

.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...)

---

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

.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.

---

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

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

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

---

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

var contentParse = function(content){
    content = content.replace(/n?rn/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

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

链接地址: http://www.djcxy.com/p/15684.html

上一篇: HTML5是否有效的XML？

下一篇: 翡翠线断裂怎么样？