vue.js - 我可以在不使用 ul 或 ol 的情况下使用 Vue v-for

Question

我是 Vue 的新手。我想显示一些数据行，但我既不想要数字 (ol) 也不想要要点 (ul)。除了我的以下方法，还有其他方法吗？

<li v-for="product in contract.products">
  <div class="p-1 row">
    <div class="col-4">
      <strong>{{ product.productName }}</strong>
    </div>
    <div class="col-4">
      Allocation: {{ product.allocation }}
    </div>
    <div class="col-4">
      Fulfilled:  {{ product.allocationFulfilled }}
    </div>
  </div>
</li>

非常感谢。

Answer 1

虽然v-for的例子一般用<li> , 你实际上可以使用 v-for any 元素上要重复的指令。因此，您可以将标记更改为:

<div class="p-1 row" v-for="product in contract.products">
  <div class="col-4">
    <strong>{{ product.productName }} </strong>
  </div>
  <div class="col-4">
    Allocation: {{ product.allocation }}
  </div>
  <div class="col-4">
    Fulfilled:  {{ product.allocationFulfilled }}
  </div>
</div>