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

我想做一个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>

---

您可以在jade中使用以下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>

这里有文字

这里有更多的文字

---

希望有帮助。您可以在这里看到一个示例-

我建议使用发音为“and attributes”的语法，可以使用

&attributes

语法将对象分解为元素的属性。就像这里描述的那样：。如果您需要不止一个属性，那么它会更容易实现。这里有一个基于你的例子：是的，很酷，我没有意识到这一点，所以你也帮我学习了一些新东西。不错。

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