小程序商城数量加减效果

<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
});
},
原文地址:https://www.cnblogs.com/wjhaaa/p/10613727.html