網(wǎng)站關(guān)鍵詞搜不到站長seo
文章目錄
- 一、列表渲染
- 二、刪除單品
- 1.封裝刪除API
- 2.按鈕綁定事件
- 三、修改單品數(shù)量
- 1.復(fù)用步進器組件
- 2.屬性和事件的綁定
- 3.接口封裝
- 4.調(diào)用接口
- 四、修改商品選中/全選
- 1.單品選中綁定事件調(diào)用修改API
- 2.計算全選狀態(tài)
- 3.綁定事件調(diào)用全選API并渲染單品選中狀態(tài)
- 五、底部結(jié)算信息
- 1.計算選中單品列表
- 2.計算選中總件數(shù)
- 3.計算選中總金額
- 4. 結(jié)算按鈕交互
- 六、購物車兩個頁面
一、列表渲染
購物車模塊主要分為已登錄狀態(tài)顯示和未登錄狀態(tài)顯示。通過獲取會員Store進行條件渲染,調(diào)用購物車列表接口進行渲染。
調(diào)用接口并渲染
二、刪除單品
1.封裝刪除API
2.按鈕綁定事件
三、修改單品數(shù)量
1.復(fù)用步進器組件
購物車的數(shù)量修改和SKU插件的類似,可直接復(fù)用
補充類型聲明文件讓組件類型更加安全。
import { Component } from '@uni-helper/uni-app-types'/** 步進器 */
export type InputNumberBox = Component<InputNumberBoxProps>/** 步進器實例 */
export type InputNumberBoxInstance = InstanceType<InputNumberBox>/** 步進器屬性 */
expo