vue实现购物车功能

2018-09-26  本文已影响0人  H_XMM
在我们开发商城类的项目中,少不了开发购物车的功能,在刚开始接触购物车功能的时候也是一筹莫展,经过在度娘上搜索也没有完整的功能,所以就根据自己开发的实际项目,写一段完整的js代码。
首先创建一个js文件,这里面使用的都是ES语法
//获取LocalStorage
let locals = window.localStorage;
let prodTools = {
  //添加或者更新
  addOrUpdate (prod) { //id:num
    //获取原来的数据对象,查
    let prods = this.getProds();
    if(prods[prod.id]) {
      //如果商品存在追加
      prods[prod.id] += prod.num;
    }else{
      //商品部存在,直接赋值
       prods[prod.id] = prod.num;
    }
      //保存
      this.save(prods)
  },
  //删除
  delProds(id){
    let prods = this.getProds();
    //prods[id] = null;
    //删除key
    delete prods[id];
    this.save(prods); 
  },
  getProds(){
    //默认第一次,没有数据
    return JSON.parse(locals.getItem('prods') || '{}');
  },
  save(prods){
    locals
  }
}
上一篇下一篇

猜你喜欢

热点阅读