Vue: 购物车数量加减按钮

效果图:

HTML:

<div class="label">
    <p class="buy_num">购买数量</p>
    <button class="btn_minute" @click="btnMinute">-</button>
    <input type="text" value="0" size="1" v-model="count">
    <button class="btn_add" @click="btnAdd">+</button>
</div>

VUE:

methods: {
  /*
  * 购买数量按钮+
  */
  btnAdd (count) {
   // 如果是低价商品,则限购
    if (this.vegas_id) {
      Toast('优惠商品限购一件哦~')
    } else {
    // 如果数量大于商品库存
     if (this.count >= this.stock) {
        Toast('该宝贝不能购买更多了~')
      } else {
        this.count++
      }
    }
  },
  /*
  * 购买数量按钮-
  */
  btnMinute (count) {
    if (this.count <= 1) {
      Toast('该宝贝不能减少了哟~')
    } else {
      this.count--
    }
  }
}
原文地址:https://www.cnblogs.com/Awen71815iou/p/11314160.html