将内容分配给一个mixin中的多个块,它在Jade中dynamic生成一个嵌套的HTML结构?

我想创build下面的HTML结构

<div class="outerspace"> <div class="inner1"><p>Inner1 content</p></div> <div class="inner2"><p>Inner2 content</p></div> <div class="inner3"><p>Inner3 content</p></div> (...) </div> 

而内部divs的数量可能会有所不同。

例1:


我可以创build两个mixin(一个òuterspace和一个“mixin”),使用block关键字嵌套它们,并为每个div元素放置不同的内容:

 mixin outerspace() div.outerspace block mixin inner($number) div(class="inner" + $number) block //- call the mixins +outerspace() +inner(1) p Inner1 content +inner(2) p Inner3 content +inner(3) p Inner3 content ... 

例2:


这个例子试图用一个单一的mixin来做同样的事情:

 mixin nested_structure($number) div.outerspace each item in $number div(class="inner" + item) block //- call the mixin +nested_structure([1, 2, 3]) p Inner content 

这导致与上述相同的结构,但是将相同的内容分配给每个生成的块:

 <div class="outerspace"> <div class="inner1"><p>Inner content</p></div> <div class="inner2"><p>Inner content</p></div> <div class="inner3"><p>Inner content</p></div> </div> 

问题:如何使用示例2来生成所需的HTML结构,但同时为每个内部div元素分配不同的内容?

你不能只是把“p内容”线内的mixin?

 mixin nested_structure($number) div.outerspace each item in $number div(class="inner" + item) p Inner#{item} content //- call the mixin +nested_structure([1, 2, 3]) 

这将输出:

 <div class="outerspace"> <div class="inner1"><p>Inner1 content</p></div> <div class="inner2"><p>Inner2 content</p></div> <div class="inner3"><p>Inner3 content</p></div> </div>