[Vuejs]-Update input field total from variable number of input fields in Vue2

You can use a computed property like this for subTotal:

computed: {
    subTotal: function () {
      return this.productList.reduce(
        (p, np) => p.productTotal + np.productTotal
      );
    },
  },

Pass a reference like v-on:change="updateCart(product)" to clicked product to update it’s values:

methods: {
    updateCart: function (product) {
      product.productTotal = Number(product.qty) * Number(product.unit_price);
    },
 },

Every time we update the product.productTotal here, subTotal will automatically update since it is a computed property.

Side note: I’ve added productTotal property to each product. If your data doesn’t contain it, you can add it manually in API success callback before setting the data.