我正在嘗試設(shè)置一個(gè)收銀員屏幕..基本上我需要一個(gè) addToCart 功能..非常簡(jiǎn)單吧？！我面臨一些奇怪的邏輯錯(cuò)誤。我所做的是單擊一個(gè)項(xiàng)目，捕獲它并將其作為參數(shù)傳遞給一個(gè)函數(shù)，該函數(shù)依次映射我的 Bill 數(shù)組以檢查該項(xiàng)目是否已存在。如果確實(shí)如此，它只會(huì)將數(shù)量加一，否則，它將將該項(xiàng)目推入數(shù)組中。一切都運(yùn)行良好，直到我刪除一個(gè)項(xiàng)目并將其重新添加到數(shù)組中。它會(huì)保留之前的數(shù)量，如果它是 5，那么即使在刪除后它仍保留 5。為了更好的解釋?zhuān)@是我的代碼......這就是我將商品添加到 Bill（購(gòu)物車(chē)）的方式... TypeScriptaddToCart(item: SalesScreenItemsModel) {let itemExists = false;// tslint:disable-next-line: variable-namethis.Bill.map((ele, _index) => { if (item.itemId === ele.itemId) { itemExists = true; ele.itemQuantity = ele.itemQuantity + 1; } return ele;});if (itemExists === false) { this.Bill.push(item);}超文本標(biāo)記語(yǔ)言<div class="col-xl-3 col-lg-4 col-md-4 col-sm-6 col-xs-12" *ngFor="let item of items"><div class="card mb-3 widget-content bg-arielle-smile item-pic" style="overflow: hidden; padding: 0;"><div class='box'> <div class='content'> <div class="widget-content-wrapper text-white content" style="justify-content: center;"> <div class="widget-content-left text-center"> <img src="{{ item.itemPicture}}" alt="Raised image" class="img-fluid" (click)="addToCart(item)"> </div> </div> </div></div>刪除功能deleteBillItem(itemIndex: number) {this.Bill.splice(itemIndex, 1);}超文本標(biāo)記語(yǔ)言<tr *ngFor="let bill of Bill; let i = index"> <th scope="row" class="text-center">{{i + 1}}</th> <td class="text-center">{{bill.itemName}}</td> <td class="text-center">{{bill.itemQuantity}}</td> <td class="text-center">{{ bill.itemPrice * bill.itemQuantity }}</td> <td class="text-center"> <button class="btn-icon btn-icon-only btn btn-outline-danger" (click)="deleteBillItem(i)" style="padding: 1px 6px;"> <i class="pe-7s-trash btn-icon-wrapper"> </i> </button> </td> </tr>問(wèn)題是，當(dāng)我記錄我的物品數(shù)組時(shí)，物品數(shù)量的變化實(shí)際上發(fā)生在主數(shù)組和賬單上......我知道這應(yīng)該很簡(jiǎn)單，這就是為什么它讓我發(fā)瘋......
2 回答
UYOU
TA貢獻(xiàn)1878條經(jīng)驗(yàn) 獲得超4個(gè)贊
問(wèn)題是您缺少以下作業(yè)map：
this.Bill = this.Bill.map...
但是，作為建議，您可以編寫(xiě)一種更實(shí)用的方法：
addToCart(item: SalesScreenItemsModel) {
const itemExists = this.Bill.some(element => element.itemId === item.itemId);
if (itemExists) {
this.Bill = this.Bill.map(element => ({
...element,
itemQuantity: element.itemQuantity + (element.itemId === item.itemId ? 1 : 0)
}));
} else {
this.Bill = [...this.Bill, item];
}
}
對(duì)于remove：
deleteBillItem(itemIndex: number) {
this.Bill = this.Bill.filter((element, index) => index !== itemIndex);
}
另外，Bill這不是數(shù)組/列表的最佳名稱(chēng):)
富國(guó)滬深
TA貢獻(xiàn)1790條經(jīng)驗(yàn) 獲得超9個(gè)贊
添加項(xiàng)目時(shí)嘗試將 item.itemQuantity 設(shè)置為 1
addToCart(item: SalesScreenItemsModel) {
// tslint:disable-next-line: variable-name
const itemIndex=this.Bill.find((billItem) => item.itemId == billItem.itemId);
if(itemIndex == -1){
item.itemQuantity=1;
this.Bill.push(item);
return;
}
this.bill[itemIndex].itemQuantity+=1;
}
- 2 回答
- 0 關(guān)注
- 114 瀏覽
添加回答
舉報(bào)
0/150
提交
取消