技術棧
Appgallery connect
前言：
上一節我們實現訂單與優惠券的聯合提交時，我去到訂單列表頁面查看生成的訂單信息，發現現在的訂單從信息展示到價格計算全都是有問題的。所以緊急的把對應的問題修改一下。
問題來源：
async aboutToAppear(): Promise<void> {const value = await StorageUtils.getAll('user');if (value != "") {this.user = JSON.parse(value)}if (this.currentIndexCheck==this.currentIndex) {let databaseZone = cloudDatabase.zone('default');let condition = new cloudDatabase.DatabaseQuery(order_list);condition.equalTo("user_id",this.user?.user_id).and().equalTo("order_status",0)let listData = await databaseZone.query(condition);let json = JSON.stringify(listData)let data1:OrderList[]= JSON.parse(json)this.orderInfo=data1let condition1 = new cloudDatabase.DatabaseQuery(order_product_list);condition1.equalTo("order_product_id",data1[0].order_product_id)let listData1 = await databaseZone.query(condition1);let json1 = JSON.stringify(listData1)this.productList=JSON.parse(json1)this.flag=true}}
我們可以看到，當我們進入到待發貨頁面的時候，我們進行了orderlist所有訂單的請求，這里的請求是沒有錯的，我們繼續向下，這時候我們通過條件進行數據查詢
condition1.equalTo("order_product_id",data1[0].order_product_id)
這里我們直接拿了當前第一條數據放到list中去執行邏輯，這就會導致，我們列表的所有內容展示的都是第一條的相關商品和價格，展示的圖片和價格都是一樣的。
發現問題之后決定采用map來存儲不同order_product_id對應的數據，這樣我們在循環的時候用order_product_id來作為key ，取出對應的數據就好了。現在我們來進行修改。
//先定義一個全局的map接收內容@State mapList:Map<string,OrderProductList[]>|null=null//在這里把原先只請求第一條的邏輯替換掉存到map中```css
const myMap = new Map<string,OrderProductList[]>();for (let i = 0; i <data1.length; i++) {let condition1 = new cloudDatabase.DatabaseQuery(order_product_list);condition1.equalTo("order_product_id",data1[i].order_product_id)let listData1 = await databaseZone.query(condition1);let json1 = JSON.stringify(listData1)myMap.set(data1[i].order_product_id,JSON.parse(json1))}this.mapList=myMap
現在我們就拿到了所有的order_product_list對應的商品數據了，現在我們還缺少對應的價格計算
//因為我們列表是通過循環展示的，這樣每次我們都只會取一條數據出來，所以我們只需要取出key 對應的數組中的第一條數據即可price(item:OrderList):number{const money= this.mapList!.get(String(item.order_product_id))return money![0].buyAmount*money![0].price}
在商品流數據展示的list我們也要吧數據源修改一下
List({space:10}){ForEach(this.mapList?.get(item.order_product_id),(pos:OrderProductList)=>{ListItem(){Column(){Image(pos.img).height(60).width(60).borderRadius(5)}}})}.padding({left:10}).width('100%').listDirection(Axis.Horizontal).height(80)
這樣我們的列表頁面就完成了邏輯優化，變得通順了
)
