Vue实现，购物网站添加购物车时，购买数量的校验

项目场景：

在使用Vue实现购物网站案例时，需要在添加到购物车时，对商品的数量限制为只能是整数，以防止用户随意输入。

---

解决方案：

省略其他无关代码

<template>
<div class="cartWrap">
  <!-- 购买的商品数量 -->
  <div class="controls">
    <input autocomplete="off" class="itxt" v-model="skuNum" @change="changeSkuNum"/>
    <a href="javascript:" class="plus" @click="skuNum++">+</a>
    <a href="javascript:" class="mins" @click="skuNum > 1 skuNum-- : (skuNum = 1)">-</a>
</div>
<template/>
export default {
methods: {
//用户输入购买数量
    changeSkuNum(event) {  //event获取用户输入的内容
      let value = event.target.value * 1; //获取用户输入的内容
      if (isNaN(value) || value < 1) { //进行判断isNaN（value）若为否则不合法，直接为1.若输入的值小于1，也不合法，直接为1.
        this.skuNum = 1;
      } else {
      //否则判断为合法
        this.skuNum = parseInt(value);
      }
}
}