主要看一下購物車的計算過程
實現後的基本樣式
# 具體**
主要看shops頁面,
+ shops頁面data資料
```data: , //商品
curt: 0, //分類id
curindex: 0, //當前index
idx: 0,
ishow: 1,
cai: , //菜的陣列
allprice: 0, //總家
allnum: 0 //總商品數
},```
```onload: function (options) )
console.log(this.data.cai)
} else }})
}```
+ id 為index頁面傳過來的商家 id;依據商家id來顯示不同商家
+ 進入商家頁面 後的布局;頭部就不看了,主要看菜的分類以及都有哪些菜
在這之前需要在商品以及評價的切換中拿到curt,curt就是分類的id
+ 菜品切換
```}
```+ 切換**就不看了,主要是拿到分類的id=>curt
### 下面就是分類下的布局
```}
月售}¥}-}
+```
#### 先來看下增加的計算邏輯
```//增加商品數量
add(e) )
this.getall() //計算總計
}```
點選按鈕時依據哪個分類下的哪個菜來區分;每點選一次商品數量+1;最後需要實時計算** this.getall()
#### 減少的計算邏輯與增加超不多
```minus(e)
num--;
//重新賦值數量
cai[curt][index].num = num
this.setdata()
this.getall()
}```
多了乙個判斷而已
#### 接下來就是計算總**
```//計算總價
getall()
}this.setdata();
},```
裡面都有注釋也不難看懂,就不解釋了!!!
### 注意一切已資料為中心!!
### 最後點選去結算的跳轉
```//跳轉支付頁面
getallprice() )
return
} else )}}
```判斷一下是否有商品
在這裡傳遞的資料都可以帶入到支付頁面
## 結束需要**請移步到我的github
+
微信小程式購物車功能
管理您的購物車 點選立即前往 全選 合計 結算 page shop mana management goto carts goods goods check checkbox goods details goods img goods img image goods title goods name...
微信小程式之購物車demo
這篇小demo主要使用了一下幾個技術點 1 全域性變數的使用 在這裡定義的變數 任何乙個頁面和元件都可以訪問到 在使用到的頁面 宣告乙個例項 然後 這樣就可以訪問到 修改也可以直接修改 2 input元件的使用 這種把checkbox group 放在循壞裡面是不太好的 因為這樣列印那個事件e的話取...
微信小程式之購物車功能
先來弄清楚購物車的需求。根據設計圖,我們可以先實現靜態頁面。接下來,再看看乙個購物車需要什麼樣的資料。知道了需要這些資料,在頁面初始化的時候我們先定義好這些。page onshow 購物車列表資料我們一般是通過請求伺服器拿到的資料,所以我們放在生命週期函式裡給 carts 賦值。想到每次進到購物車都...