1. 程式人生 > >微信小程式:點選商品+,出現數量和-

微信小程式:點選商品+,出現數量和-

問題描述:

商品列表中只有“+”,點選之後出現“-1+”,可以對數量進行增減,

效果

image

.wxml

 <view class="add-box">         
       <image src="/image/reduce.png" class="add-img {{item.numbers==0 ?'none':''}}" bindtap="reduceNum" data-index="{{index}}"></image>
       <view  class="num {{item.numbers==0?'none':''}}"
>
{{item.numbers}}</view> <image src="/image/add1.png" class="add-img" bindtap="addNum" data-index="{{index}}" data-index="{{index}}"></image> </view>

.js

數量是從後臺拿到的一個數據,每次點選“+”使得這個商品的數量自增一,點選“-”則數量自減一,直到數量為0後數量和減號消失

 data:{
     amount: 0,
    index:0,
 },


 addNum(e) {
    let index = e.currentTarget
.dataset.index; let fruitUrl = this.data.fruitUrl; let numbers = fruitUrl[index].numbers; numbers = numbers + 1; fruitUrl[index].numbers = numbers; this.setData({ fruitUrl: fruitUrl }); }, reduceNum(e) { let index = e.currentTarget.dataset.index; let fruitUrl = this.data
.fruitUrl; let numbers = fruitUrl[index].numbers; numbers--; fruitUrl[index].numbers = numbers; this.setData({ fruitUrl: fruitUrl }) },