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>，但实际上您可以在 any 元素上使用v-for指令想重复。因此，您可以将标记更改为此：

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

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

1 个答案: