有条件地向子元素Vue js发送道具

Question

我想通过这个例子有条件地向 Quantity 组件发送道具。

<v-card
 class="mx-auto"
 max-width="344"
 shaped
 v-for="(item, index) in allItems || orderedItems"
 :key="index"
>

<Quantity {allItems ? :Items = item : :Ordered = item} />

</v-card>

如果orderedItems 被激活，我想发送 Ordered 道具，如果allItems 被激活，我想发送Items。

Answer 1

改用v-bind：

<Quantity v-bind="quantityProps" />

然后为此创建一个方法：

quantityProps(item) {
  return {
    [this.allItems ? 'Items' : 'Ordered']: item
  }
}