如何在Jade中添加mixin中的类？

Question

我想制作Jade mixin，它会输出这样的东西

<div class="progress__graph">
          <div class="progress__bar two">
            <p>Web Design 80%</p>
          </div>
        </div>
        <div class="progress__graph">
          <div class="progress__bar three">
            <p>Web Design 80% </p>
          </div>
        </div>

到目前为止我有这个，但我无法弄清楚如何制作它所以我也可以添加类（'两个'，'三'等）

mixin progress(text)
 .progress__graph
   .progress__bar
    p #{text}

Answer 1

你可以在玉器中使用以下mixin：

mixin progress(text, className)
  .progress__graph
    .progress__bar(class=className)
       p #{text}

+progress('Text goes here', 'one')
+progress('More text here', 'two')

这将呈现以下HTML：

<div class="progress__graph">
  <div class="progress__bar one">
    <p>Text goes here</p>
  </div>
</div>
<div class="progress__graph">
  <div class="progress__bar two">
    <p>More text here</p>
  </div>
</div>

希望有所帮助。 你可以在这里看到一个例子 - http://codepen.io/AdamCCFC/pen/dXdWXy