利用watch監(jiān)聽,上部的件重體是下面所有件重體的總和

1.需要實(shí)現(xiàn)的是,上部有三個(gè)框 件數(shù),重量,體積,下部是一個(gè)由件重體輸入框組成的循環(huán)的數(shù)組,

當(dāng)下部輸入框值改變得時(shí)候上部通過監(jiān)聽隨著改變

需要監(jiān)聽下部數(shù)組skuData,普通監(jiān)聽實(shí)現(xiàn)不了所以需要深度監(jiān)聽,使用完發(fā)現(xiàn)上部的輸入框有可能失靈,所以在input上要添加@input="change" 方法里面加上vue強(qiáng)制刷新

change(){

this.$forceUpdate()

}


//resetArray調(diào)用是為了去除數(shù)組中重復(fù)對象和空對象因?yàn)橄虏康漠?dāng)前行數(shù)據(jù)有可能全都沒有

resetArray(nowArr){

? ? let arr1 = []

? ? let obj ={}

? ? for (let j in nowArr) {

? ? ? ? for (let prop in nowArr[j]) {

? ? ? ? ? ? if (prop != '' && nowArr[j][prop] != '') {

? ? ? ? ? ? ? ? obj = nowArr[j]

}

}

? ? ? ? if(Object.keys(obj)!=0){

? ? ? ? ? ? arr1.push(obj)

}

}

? ? (function () {//去除數(shù)組中重復(fù)對象

? ? ? ? let unique = {};

? ? ? ? arr1.forEach(function (a) {

? ? ? ? ? ? unique[JSON.stringify(a)] = 1

? ? ? ? });

? ? ? ? arr1 = Object.keys(unique).map(function (u) {

? ? ? ? ? ? return JSON.parse(u)

});

? ? ? ? return arr1

? ? })(arr1)

? ? console.log(222222)

? ? return arr1

}

//監(jiān)聽下部數(shù)組的改變從而對上部數(shù)據(jù)進(jìn)行改變

skuData:{

? ? handler:function(newVal,oldval){

? ? let newArr = this.resetArray(newVal)

? ? ? ? let quantity = 0

? ? ? ? let volume = 0

? ? ? ? let weight = 0

? ? ? ? for (let i in newArr) {

//當(dāng)itemNumber 和 quantity同時(shí)存在的時(shí)候才能改變上部數(shù)據(jù)

? ? ? ? ? ? if(newArr[i].itemNumber && newArr[i].quantity){

? ? ? ? ? ? ? ? quantity+=newArr[i].quantity ? Number(newArr[i].quantity) : 0

? ? ? ? ? ? ? ? volume+= newArr[i].volume ? Number(newArr[i].volume) : 0

? ? ? ? ? ? ? ? weight+= newArr[i].weight ? Number(newArr[i].weight) : 0

? ? ? ? ? ? }

}

? ? ? ? //明細(xì)數(shù)量 this.createdOrder.detailQuantity = sum

//數(shù)量

? ? ? ? this.createdOrder.detailQuantity = (quantity == 0) ? '' : quantity

? ? ? ? this.createdOrder.quantity = (quantity == 0) ? '' : quantity

? ? ? ? this.createdOrder.grossWeight = (weight == 0) ? '' : weight

? ? ? ? this.createdOrder.volume = (volume == 0) ? '' : volume

? ? // 毛重? this.createdOrder.grossWeight

// 體積? this.createdOrder.volume

? ? },

? ? deep:true

},

?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請聯(lián)系作者
【社區(qū)內(nèi)容提示】社區(qū)部分內(nèi)容疑似由AI輔助生成,瀏覽時(shí)請結(jié)合常識與多方信息審慎甄別。
平臺聲明:文章內(nèi)容(如有圖片或視頻亦包括在內(nèi))由作者上傳并發(fā)布,文章內(nèi)容僅代表作者本人觀點(diǎn),簡書系信息發(fā)布平臺,僅提供信息存儲服務(wù)。

相關(guān)閱讀更多精彩內(nèi)容

友情鏈接更多精彩內(nèi)容