Инкремент и дикремент для подсчёта суммы билетов?

Question

подскажите как при увелечения количества билетов в кино или интремента - управлять ценной перед оплатой Цена одного билета - 200

 <button @click="addCounter()">+</button>
 <button @click="incCounter()">-</button>
    {{counter}}
 <p>Price {{price}}</p>

Модель

counter: 0,
price: 200

Методы

addCounter() {
            this.counter++
            if (this.counter>=1) {
                this.price += 200
            }
        },
        incCounter() {

            if (this.counter>=0) {
                this.counter--
                this.price -= 200
            }
        }

Answer 1

Имея цену за один билет, вы можете просто управлять счетчиком counter (количеством билетов), чтобы получать итоговую стоимость всех билетов, используя допустим вычислительное свойство:

computed: {
    totalPrice() {
      return this.counter * this.price
    }
  },

Полный пример:

new Vue({
  el: '#app',
  data() {
    return {
      counter: 1,
      price: 200,
    }
  },
  computed: {
    totalPrice() {
      return this.counter * this.price
    }
  },
  methods: {
    addCounter() {
      this.counter++
    },
    incCounter() {
      this.counter--
    }
  }
})

<script src="https://cdnjs.cloudflare.com/ajax/libs/vue/2.5.17/vue.min.js"></script>
<div id="app">
  <button @click="addCounter">+</button>
  <button @click="incCounter" :disabled="counter < 1">-</button>
  <hr>Всего билетов - {{counter}}
  <p>Итоговая стоимость = {{totalPrice}}</p>
</div>

БЛОГ НА HUSL

Инкремент и дикремент для подсчёта суммы билетов?

Ответы (1 шт):