Question

我在Jade中的每个循环都有一些问题。我必须在行中显示2个项目，但它对我不起作用。

each item,i in feature.items 
    .col-mb-8.col-tb-12.col-dt-6
        h4.b--feature__title!=item.title
        p.b--feature__text!=item.text

我需要在奇数项之前添加.col-group。翡翠有可能吗？有谁可以帮助我吗？

Answer 1

你可以做这样的事情，为偶数和奇数元素提供不同的输出：

each item,i in feature.items 
    - if (i % 2) {
    .col-mb-8.col-tb-12.col-dt-6
        h4.b--feature__title!=item.title
        p.b--feature__text!=item.text
    - } else {
    .col-mb-8.col-tb-12.col-dt-6
        h4.b--feature__title!=item.title
        p.b--feature__text!=item.text
    - }

只需对标记或类进行更改。

Answer 2

我终于找到了适合我的解决方案

    each  item,i in feature.items
        - if (i.substr(4)%2) {
            | <div class='col-group'>
        - }
            .col-mb-8.col-tb-12.col-dt-6
                h4.b--feature__title!=item.title
                p.b--feature__text!=item.text
        - if (i.substr(4)%2 == 0)  {
            | </div>
        - }

然后渲染到

<div class="col-group">
  <div class="col-mb-8 col-tb-12 col-dt-6">
    <h4 class="b--feature__title">heade</h4>
    <p class="b--feature__text">text</p>
  </div>
  <div class="col-mb-8 col-tb-12 col-dt-6">
    <h4 class="b--feature__title">heade</h4>
    <p class="b--feature__text">text</p>
  </div>
</div>
<div class="col-group">
  <div class="col-mb-8 col-tb-12 col-dt-6">
    <h4 class="b--feature__title">heade</h4>
    <p class="b--feature__text">text</p>
  </div>
  <div class="col-mb-8 col-tb-12 col-dt-6">
    <h4 class="b--feature__title">heade</h4>
    <p class="b--feature__text">text</p>
  </div>
</div>

使用Jade在每个循环中的一行中显示两个项目

2 个答案: