這個問題並非難點，只是我因為習慣性思維，通過變數去實現時思路受限，並在此困惑良久，所以做個記錄。

如圖，型別包括後面的數量選擇，是來自資料庫的 for 迴圈加載出來的，我們要實現的是點選任意一個數量加減，而不影響其他。

wxml：

<!--page/test/test.wxml-->
<view class='dateM'>
  <view class='item rowBox' wx:for="{{ProductList}}">
    <view class='dateML rowCon'>
      <view class=''>
        <text class='fs17 pr10'>{{item.ProductName}}</text>
        <text class='fs12 c38bafe'>{{item.isCancel}}</text>
      </view>
      <view class='mt5 cff4040 fs13'>
        <text class='pr10'>同行價 ￥4/4</text>
        <text>團隊價 ￥4/5 </text>
      </view>
    </view>
    <view class='dateMR rowBox'>
      <view class="reduce" data-tag="{{item.TagId}}" data-id='{{index}}' catchtap="reduceNum">
        <text class="iconfont icon-jian"></text>
      </view>
      <view class="num">
        <block wx:if="{{item.count}}">
          <input data-id="{{index}}" type="number" value="{{item.count}}" disabled/>
        </block>
        <block wx:else>
          <input data-id="{{index}}" type="number" value="0" disabled/>
        </block>
      </view>
      <view class="add active" data-tag="{{item.TagId}}" data-id='{{index}}' catchtap="addNum">
        <text class="iconfont icon-jia"></text>
      </view>
    </view>
  </view>
</view>
 

js:

// page/test/test.js
Page({
  data: {
    "ProductList": [          //產品集合
      {
        "ProductName": "標準間", //產品名稱
        "isCancel": "可以取消",  //是否可取消[0可以，1不可以]
        "isAutoConfirm": "人工確認", //是否自動確認[0人工確認，1自動確認]
        "DayStatus": 0,       //當日房態[0正常，1關閉]
        "DayJsPrice": "電詢", //當日結算價
        "DayGpPrice": "電詢", //當日團隊價
        "DayNum": 0,         //當日房間數量
        'TagId': 85,
        'ProductId': 101
      },
      {
        "ProductName": "大床房",
        "isCancel": "可以取消",
        "isAutoConfirm": "人工確認",
        "DayStatus": 0,
        "DayJsPrice": "電詢",
        "DayGpPrice": "電詢",
        "DayNum": 0,
        'TagId': 86,
        'ProductId': 103
      },
      {
        "ProductName": "雙人間",
        "isCancel": "可以取消",
        "isAutoConfirm": "人工確認",
        "DayStatus": 0,
        "DayJsPrice": "電詢",
        "DayGpPrice": "電詢",
        "DayNum": 0,
        'TagId': 87,
        'ProductId': 104
      }
    ]
  },
  addNum: function (e) {
    var tag = e.currentTarget.dataset.tag,
      id = e.currentTarget.dataset.id;
    if (!this.data.ProductList[id].count){
      var countVal = 0;
      countVal++;
      var count = 'ProductList['+id+'].count';
      this.setData({
        [count]: countVal
      })
      console.log(this.data.ProductList[id].count)
    } else {
      var countVal = this.data.ProductList[id].count;
      countVal++;
      var count = 'ProductList[' + id + '].count';
      this.setData({
        [count]: countVal
      })
    }
  }
})
 

wxss:

/* page/test/test.wxss */
/* 彈性盒子屬性 --橫向*/
.rowBox{ display:-webkit-box; display:-webkit-flex; -webkit-flex-flow:row;}
.rowCon{ -webkit-box-flex: 1;-webkit-flex: 1;flex: 1; }
/* 彈性盒子屬性 --豎向*/
.verBox{ display:-webkit-flex; -webkit-box-orient: vertical;-webkit-flex-flow: column;flex-flow: column;}
.fs08 {font-size:16rpx;}
.fs10 {font-size:20rpx;}
.fs11 {font-size:22rpx;}
.fs12 {font-size:24rpx;}
.fs13 {font-size:26rpx;}
.fs14 {font-size:28rpx;}
.fs15 {font-size:30rpx;}
.fs16 {font-size:32rpx;}
.fs17 {font-size:34rpx;}
.fs18 {font-size:36rpx;}
.fs19 {font-size:38rpx;}
.fs20 {font-size:40rpx;}
.fs21 {font-size:42rpx;}
.fs22 {font-size:44rpx;}
.fs23 {font-size:46rpx;}
.fs24 {font-size:48rpx;}
.fs25 {font-size:50rpx;}
.fs26 {font-size:52rpx;}
.fs28 {font-size:56rpx;}
.fs30 {font-size:60rpx;}
.ml5 {margin-left:5px;}
.pr10 {padding-right:10px;}



.dateM{
  width: 100%;
  padding: 20rpx;
  box-sizing: border-box;
}
.dateM .item{
  padding: 16rpx 0;
}
 .dateM .dateMR .reduce,
 .dateM .dateMR .add{
  position: relative;
  top: 20rpx;
  text-align: center;
  width: 56rpx;
  height: 56rpx;
  line-height: 60rpx;
  color: #ddd;
  font-size: 20rpx;
}
 .dateM .dateMR .reduce.active,
 .dateM .dateMR .add.active{
  color: #fec93d;
}
 .dateM .dateMR .reduce text,
 .dateM .dateMR .add text{
  font-size: 40rpx;
  display: inline-block;
}
 .dateM .dateMR .num{
  position: relative;
  top: 22rpx;
  text-align: center;
  width: 50rpx;
  height: 56rpx;
  line-height: 56rpx;
}
 .dateM .dateMR .num input{
  text-align: center;
  width: 50rpx;
  height: 56rpx;
  line-height: 56rpx;
  font-size: 28rpx;
}