vue2.0如何实现购物车的加减?

Question

谢谢大家，问题已经解决了。正确的代码已经更新···
想要拿到v-model.number="lists.buy_num"这个的值，从而进行操作。新手哦，请不要给负分`

   <div id="cart-box">
        <article class="con-main">                    
                 <div class="co-lists" v-for="（lists,index） in cart_list">
                        <div class="cpn-num">                                   
                               <span @click="reduceCartNum(index)"></span>
                                <input type="text" class="goods_num" readonly v-model.number="lists.buy_num">
                                <span  class="num_none"  @click="addCartNum(index)"></span>                                                    
                           </div>
                   </div>
                  
          </article>
   </div>

<script type="text/javascript">
    var cartbox=new Vue({
         el:"#cart-box",
         data:{
               buy_num:'',
               cart_list: [ 
               ],
             },
             created:function(){
                    this.getGoods()
             },
             methods:{
                    getGoods:function(){
                         $.getJSON("{:url('/cart/getCart',)}", function(json){
                                if(json.code == 200){
                                     cartbox.cart_list=json.data.cart_list;
                                }else{

                                }
                            });    
                    },
                 addCartNum:function (index) {
                     var buy_nums=this.cart_list[index].buy_num
                     if(buy_nums>30){                             
                         return false;
                      }                      
                     this.cart_list[index].buy_num++;
                  },
                  reduceCartNum:function(index){
                       var buy_nums=this.cart_list[index].buy_num
                       if(buy_nums <= 1){                                                          
                           return false;
                          }
                    this.cart_list[index].buy_num--;
                  }
                                        
             }
        
        });
</script>

Answer 1

大神教我改好了~~

Answer 2

要看你购物车的数据结构了，无非就是操作相关的数据，最基本的，往数组中 插入元素 或 删除元素。

Answer 3

用vue1.0做过大概是这样

addCart(event) {
            if (!this.food.count) {
                Vue.set(this.food, 'count', 1);
                this.food.count = 1;
            } else {
                this.food.count++;
            };

Answer 4

vuex的demo里面不就是个购物车的实现么，可以参考下

传送门

Answer 5

这是文章吧 不像是问题
v-model.number这个是什么意思