Vue.js количество картографической корзины для списка товаров

#vue.js #vuejs2 #vuetify.js

Вопрос:

Я получаю товары из REST API, и при добавлении товаров в мою корзину я хотел бы, чтобы количество обновлялось в списке товаров:

 lt;v-card  :loading="loading"  class="mx-auto my-12"  max-width="374"  v-for="x in info.data"  v-bind:key="x.id"  gt;  lt;template slot="progress"gt;  lt;v-progress-linear  color="deep-purple"  height="10"  indeterminate  gt;lt;/v-progress-lineargt;  lt;/templategt;   lt;v-img  height="250"  src="https://cdn.vuetifyjs.com/images/cards/cooking.png"  gt;lt;/v-imggt;   lt;v-card-titlegt;{{x.name}} - {{x.list_price}}€ lt;/v-card-titlegt;   lt;v-card-textgt;  lt;v-row  class="mx-0"  gt;  lt;div v-if="x.description_sale"gt;{{x.description_sale}}lt;/divgt;  lt;/v-rowgt;     lt;/v-card-textgt;   lt;v-card-actionsgt;  lt;v-containergt;  lt;v-rowgt;  lt;v-col  cols="4"  sm="3"gt;  lt;v-btn  class="mx-2"  fab  dark  small  color="primary"  @click="removeQty(x)"  gt;  lt;v-icon darkgt;  mdi-minus  lt;/v-icongt;  lt;/v-btngt;  lt;/v-colgt;   lt;v-col  cols="4"  sm="6"gt;    lt;v-text-field  v-model="cart.product_uom_qty" lt;-- I would like to get this data updated when the cart gets updated  class="centered-input"  type="number"  single-line  disabled  color="deep-purple"  gt;  lt;/v-text-fieldgt;  lt;/v-colgt;  lt;v-col  cols="4"  sm="3"gt;  lt;v-btn  class="mx-2"  fab  dark  small  color="primary"  @click="addQty(x)"  gt;  lt;v-icon darkgt;  mdi-plus  lt;/v-icongt;  lt;/v-btngt;  lt;/v-colgt;  lt;/v-rowgt;  lt;/v-containergt;    lt;/v-card-actionsgt;  

Объект «Тележка»:

 [  {  "product_id": 2,  "product_uom_qty": 5  } ]  

В x.id и идентификатор продукта корзины одинаковы, поэтому я хотел бы сопоставить эти 2.

Я попытался найти решение с помощью метода, но не смог получить рабочее решение.

Есть какие-нибудь предложения о том, как решить эту проблему?