美文网首页
购物车笔记

购物车笔记

作者: 曹锦花 | 来源:发表于2019-11-21 18:09 被阅读0次

ES6 find方法及...扩展运算符

      //加入购物车
      addCourseToCart(index){
        let item = this.courseList[index];
        //isHasCourse 是否在购物车中存在
        let isHasCourse = this.courseItem.find(x=>x.id == item.id)
        if(isHasCourse){
          isHasCourse.number += 1;
        }else{
          //增加number和isActive属性
          this.courseItem.push({
            ...item,
            number: 1,
            isActive: true
          });
        }
      },

计算属性computed 过滤filter

    computed: {
      //被选中的数目
      isActiveCourse(){
        return this.courseItem.filter(item=>item.isActive).length
      },
      //全部数目
      allCourseList(){
        return this.courseItem.length
      },
      //总价
      allPrice(){
        let num = 0;
        this.courseItem.forEach(item => {
          if(item.isActive){
            num += item.price * item.number
          }
        });
        return num;
      }
    },

相关文章

网友评论

      本文标题:购物车笔记

      本文链接:https://www.haomeiwen.com/subject/bmntwctx.html