vue ele 專案的購物車控制控制元件
阿新 • • 發佈:2018-12-20
說說最近在工作很閒的時候,在GITHUB找了一個關於VUE2.0的餓了麼專案來練手,然後在遇到的一個bug;
有點詭異:
是同一個購物車的控制元件元件,分別位於不同的商品列表上,其中一個點選+ ,能選擇商品,其數量加一,但另外一個點選+, 沒有前者的反應;
筆者找了好久,才發現是這個程式碼做的怪:
// if (!event._constructed) {
// return
// }
event._constructed
是better-scroll的一個屬性,防止非vue事件,它適合對於一些better-scroll處理過的商品列表,所以為了讓後一個列表上的控制元件有效,要不就是把上面的三行程式碼註釋掉或者後一個商品列表也用better-scroll處理一下;
addCar(event){ console.log(this.food, "1111"); console.log("add",'1111'); // if (!event._constructed) { // return // } if(!this.food.count){ Vue.set(this.food,'count',0); } this.food.count++; console.log(this.food.count, "1111count"); //兄弟元件的一個函式呼叫 this.$root.eventHub.$emit('cart.add',event.target); }, decreaseCar(){ if(!event._constructed || !this.food.count){ return } this.food.count--; }