小程序商城数量加减效果

<view class="action stepper">

<!-- 减号 -->

<!-- 数值 -->

<text class="{{ minusStatus }}" bindtap="bindMinus">-</text>

<input type="number" bindchange="bindManual" value="{{ num }}"/>

<text class="normal" bindtap="bindPlus">+</text>

<!-- 加号 -->

</view>

 

/* 点击减号 */

bindMinus: function () {

var num = this.data.num;

// 如果大于1时，才可以减

if (num > 1) {

num--;

}

// 只有大于一件的时候，才能normal状态，否则disable状态

var minusStatus = num <= 1 ? 'disabled' : 'normal';

// 将数值与状态写回

this.setData({

num: num,

minusStatus: minusStatus

});

},

/* 点击加号 */

bindPlus: function () {

var num = this.data.num;

// 不作过多考虑自增1

num++;

// 只有大于一件的时候，才能normal状态，否则disable状态

var minusStatus = num < 1 ? 'disabled' : 'normal';

// 将数值与状态写回

this.setData({

num: num,

minusStatus: minusStatus

});

},

/* 输入框事件 */

bindManual: function (e) {

var num = e.detail.value;

// 将数值与状态写回

this.setData({

num: num

});

},