不積跬步無以至千里014

寒冰射手楊百億發表於2020-11-28

11.28工作筆記

hbuliderX H5配置

修改執行的基礎路徑 可以改變瀏覽器位址列的啟動引數 可以改變埠號

scroll-top 滾動位置

單位px rpx 在被設定時頁面會滾動到固定位置

=================================================

今天實現的操作一個陣列物件的值後同時改變另一個陣列物件的值的方法

解決了一個bug

原始碼==》

//購物車內的加減操作
			cartNum(type, index) {
				let CTlist = JSON.parse(JSON.stringify(this.cartList))
				if (type == 1) { //減
					console.log('購物車減')
					if (CTlist[index].num <= 0) {
						return;
					}
					CTlist[index].num--
				} else { //加
					console.log('購物車加')
					if (CTlist[index].num >= 10) { //限購十件
						return;
					} else {
						CTlist[index].num++
					}
				}

				this.cartList = CTlist.filter((item) => {
					return item.num > 0
				})

				console.log("購物車內操作加減", this.cartList)
				console.log("二級分類資料", this.clist) //
			},

在這裡插入圖片描述

修改後==》用for of迴圈法來找到id相等的值,然後賦值將其改變,但是到1的情況下就不執行了,因為陣列已經為空,所以再用了判斷直接修改

//購物車內的加減操作
cartNum(type, index) {
    let CTlist = JSON.parse(JSON.stringify(this.cartList))
    if (type == 1) { //減
        console.log('購物車減')
        if (CTlist[index].num <= 0) {
            return;
        }
        CTlist[index].num--
    } else { //加
        console.log('購物車加')
        if (CTlist[index].num >= 10) { //限購十件
            return;
        } else {
            CTlist[index].num++
        }
    }
    //讓購物車內的資料影響主頁的二級分類資料
    if (CTlist[index].num === 0) {//減到0的情況 直接把二級分類的資料跟我內部的資料同步歸零
        this.clist.filter((item, i) => {
            if (item.id == CTlist[index].id) {
                this.clist[i].num = CTlist[index].num
            }
        })
        console.log(this.clist)
    }
    //大於0的篩選進購物車
    this.cartList = CTlist.filter((item) => {
        return item.num > 0
    })

    for (let task of this.cartList) {//走到1的情況下 cartlist已是個空陣列 無法再繼續執行 所以主頁資料會停在1不會是0
        const itemJson = this.clist.find((item) => {
            return item.id === task.id
        });
        itemJson.num = task.num
        // 如果有相同的值那麼就返回對應的物件 如果沒有則返回 undefined
    }
    console.log("購物車內操作加減", this.cartList)
    console.log("二級分類資料", this.clist) //
},

在這裡插入圖片描述

相關文章