摘要:關(guān)于加減組件及價格計算實現(xiàn)效果一組件初始狀態(tài)只顯示,點擊號類自父組件一個新屬性同時顯示數(shù)量,出現(xiàn)號部分減號區(qū)減號區(qū)商品數(shù)量區(qū)商品數(shù)量區(qū)加號區(qū)加號區(qū)部分點擊加號執(zhí)行的
關(guān)于加/減組件及價格計算
實現(xiàn)效果:
(一)cartControl.vue組件
初始狀態(tài)只顯示+,點擊+號,food(類自父組件)set一個新屬性count,同時顯示數(shù)量,出現(xiàn)-號部分
JS部分:
export default{ props:{ food:{ type:Object } }, methods:{ //點擊加號執(zhí)行的事件 addCart(event){ //去除引入better-scroll自帶的事件點擊 if(!event._constructed){ return; } //初始狀態(tài)下,food.count是不存在的 if(!this.food.count){ //給food對象新增一個count屬性,初始值為1 Vue.set(this.food,"count",1); } else{ //如果count的值存在 //點擊加號的時候,每次count值加1 this.food.count++; } }, decreaseCart(event){ //去除引入better-scroll自帶的點擊事件 if(!event._constructed){ return; } //點擊減號時候,food.count每次減一 this.food.count--; } } }
(二)shopCart.vue組件
價格及菜品顯示部分
**JS部分:**0}"> 0}">{{totalCount}}0}"> ¥{{totalPrice}}另需配送費¥{{deliveryPrice}}{{payDesc}}購物車
清空
- {{food.name}}
¥{{food.price * food.count}}
goods父組件中:
goods.vue中的seller來自于home組件
文章版權(quán)歸作者所有,未經(jīng)允許請勿轉(zhuǎn)載,若此文章存在違規(guī)行為,您可以聯(lián)系管理員刪除。
轉(zhuǎn)載請注明本文地址:http://systransis.cn/yun/106563.html
摘要:導(dǎo)航欄導(dǎo)航欄用的組件,設(shè)置其水平方向滑動,點擊到的字體會變換樣式。而且,導(dǎo)航欄點擊不同的類別會將主頁替換成不同的結(jié)構(gòu),這就要將最開始的主頁結(jié)構(gòu)隱藏起來。 前言 購物節(jié)又要來啦?。。ㄈ龌ㄈ龌ǎ。┝闶炒蛘劾玻?!衣服打折了?。⌒』锇閭儨蕚浜觅I買買了嗎?。?!讓我看看我還多少余額哈!(滿心期待(* ̄︶ ̄))(10秒后......)好吧我還是寫個電商小程序過過癮好了。[冷漠臉]咳咳,讓我們進入正題...
摘要:導(dǎo)航欄導(dǎo)航欄用的組件,設(shè)置其水平方向滑動,點擊到的字體會變換樣式。而且,導(dǎo)航欄點擊不同的類別會將主頁替換成不同的結(jié)構(gòu),這就要將最開始的主頁結(jié)構(gòu)隱藏起來。 前言 購物節(jié)又要來啦?。。ㄈ龌ㄈ龌ǎ。┝闶炒蛘劾玻?!衣服打折了!!小伙伴們準備好買買買了嗎!??!讓我看看我還多少余額哈?。M心期待(* ̄︶ ̄))(10秒后......)好吧我還是寫個電商小程序過過癮好了。[冷漠臉]咳咳,讓我們進入正題...
閱讀 2377·2021-11-22 14:56
閱讀 1183·2019-08-30 15:55
閱讀 3215·2019-08-29 13:29
閱讀 1366·2019-08-26 13:56
閱讀 3512·2019-08-26 13:37
閱讀 569·2019-08-26 13:33
閱讀 3358·2019-08-26 13:33
閱讀 2238·2019-08-26 13:33