美文网首页
购物车笔记

购物车笔记

作者: 曹锦花 | 来源:发表于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