Javascript pug for循环-尝试通过mixin参数传入的数字动态创建#个li项

我试图动态创建一个

li

s的数量，该数量等于mixin传入的数量。我尝试使用for循环，但没有生成任何内容

以下是mixin的外观：

mixin grid-content(liCount,itemTitle1, itemDescriptionTitle1, itemDescription1, itemTitle2, itemDescriptionTitle2, itemDescription2, itemTitle3, itemDescriptionTitle3, itemDescription3)
    - var count = liCount
    .grid-content
        .container
            .row
                ul.grid-content__list.grid-content__list--not-news
                    each val in count
                        li.grid-content__item
                            h1.item-title=itemTitle+count
                            .item-content
                                h3.item-description-title=itemDescriptionTitle+count
                                p.item-description=itemDescription+count

---

这里发生了很多事情。首先，考虑以下几点：

说

count=3

。人们可能认为

p=itemtTitle+count

等同于

p=itemtTitle3

，但事实并非如此。相反，它会查找名为

itemTitle

的变量，并尝试将其值与名为

count

的变量求和，这似乎不是您想要做的

如果您试图创建一个MIXIN，可以轻松接受任意数量的网格项目，请考虑传递一个.< /P> 你可以考虑这样的一种方法：

// My Grid items

-
  var myGridItems = [
    {
      title: 'Item One Title',
      description: {
        title: 'Item One Description Title',
        contents: 'Item One Description Contents'
      }
    },
    {
      title: 'Item Two Title',
      description: {
        title: 'Item Two Description Title',
        contents: 'Item Two Description Contents'
      }
    },
    {
      title: 'Item Three Title',
      description: {
        title: 'Item Three Description Title',
        contents: 'Item Three Description Contents'
      }
    }
  ]


// My Mixin

mixin gridContent(items)

  .grid-content
    .container
      .row
        ul.grid-content__list.grid-content__list--not-news

          each item in items

            li.grid-content__item
              h1.item-title= item.title
              .item-content
                h3.item-description-title= item.description.title
                 p.item-description= item.description.contents


// Calling the Mixin

+gridContent(myGridItems)

---

好吧，有道理。如何为每个不同的li项目动态传递标题或其他内容？这就是所做的