購(gòu)物車的實(shí)現(xiàn)
建議使用的知識(shí)點(diǎn):
- 移動(dòng)端沙盒的理解(獨(dú)立整理成筆記)
- 生命周期不同階段的最佳使用場(chǎng)景(完善第一周的筆記,可以拿生意人 APP 舉例)
- Javascript 與原生代碼的交互
- 文件(數(shù)據(jù)庫(kù))的數(shù)據(jù)讀寫(xiě)
- JSON 數(shù)據(jù)格式的靈活使用
- 基本 HTML 標(biāo)簽的學(xué)習(xí)
購(gòu)物車的需求
- 商品列表接口
- 商品信息可以手工處理存儲(chǔ)在移動(dòng)端本地
- APP 底部?jī)蓚€(gè)頁(yè)簽:商品列表凛虽、購(gòu)物車
- 商品列表死遭、購(gòu)物車頁(yè)面都使用 html 文件
- 商品列表是固定的,可以寫(xiě)入本地然后讀取凯旋,也可以直接寫(xiě)在 javascript 文件
- 點(diǎn)擊【商品列表】頁(yè)簽時(shí)呀潭,該 html 文件展示本地存儲(chǔ)的商品信息钉迷,展示封面、標(biāo)題钠署、價(jià)格等基本信息(可參考豆瓣頁(yè)面)篷牌,點(diǎn)擊【添加至購(gòu)物車】后,頁(yè)面?zhèn)髦到o原生代碼更新購(gòu)物車數(shù)據(jù)
- 點(diǎn)擊【購(gòu)物車】頁(yè)簽時(shí)踏幻,顯示已添加至購(gòu)物車的商品列表枷颊,可以增加、減少數(shù)量该面,同時(shí)也傳值給原生代碼更新購(gòu)物車數(shù)據(jù)
- 實(shí)現(xiàn)實(shí)現(xiàn)購(gòu)物車的基本功能:全選夭苗、取消全選、自動(dòng)計(jì)算要結(jié)算的金額隔缀、一鍵清空等