现象
循环picker选择器，改变一个下拉框选项，导致全部下拉框选项改变；
问题
怎样操作才能实现只改变当前操作的下拉框的值?
思路
在js中设置一个数组变量，存储每个picker选择器默认的值；然后根据bingchange获取相应的索引、e.detail.value,根据这些更新数组，重新赋值，然后根据
数组的索引、值更新相应的picker索引以及值。
wxml
1 <block wx:for="{{salesList}}" wx:for-index="index" wx:key="id" wx:for-item="item"> 2 <view class="con_txt"> 3 <view class="con_txt1" style="margin-left:30rpx;width:140rpx">销售品申请</view> 4 <view class="con_txt1 con_txt2"> 5 <view class="section"> 6 <picker bindchange="bindPickerChange" value="{{item.option}}" range="{{objectArray}}" range-key="good_name" data-id="{{objectArray[item.option].id}}" data-index="{{index}}"> 7 <view class="picker" style="height:70rpx;position:relative"> 8 {{objectArray[item.option].good_name}} 9 <image src="../Image/select.png" style="width:40rpx;height:40rpx;position:absolute;left:80%;top:20%;"></image> 10 </view> 11 </picker> 12 </view> 13 </view> 14 <view class="con_txt1"> 15 <view class="section2"> 16 <input value="{{salesList[index].nums}}" name="count" bindinput="numChangeS" data-index="{{index}}" style="text-align:center;height:66rpx !important;padding-top:4rpx;" placeholder-style="color:#ddd;text-align:center;margin-top: 0px;margin-left:-8rpx" placeholder="数量"/> 17 </view> 18 </view> 19 <button class="btnC" hover-class="none" bindtap="reduceSales" data-index="{{index}}">-</button> 20 </view> 21 </block> 22 <view class="hb" bindtap="addSales"> 23 <image src="../Image/addT.png" style="width:30rpx;height:30rpx;float:left;margin-left:38%;"></image> 24 <view class="text3">继续增加商品</view> 25 </view>
js
1 data: { 2 salesList: [] //定义一个空数组 3 }, 4 //销售品删除一行 5 reduceSales: function (e) { 6 var that = this; 7 var index = e.currentTarget.dataset.index; 8 var list = that.data.salesList; 9 if (list.length === 1) { 10 return; 11 } 12 list.splice(index, 1); 13 this.setData({ 14 salesList: list 15 }) 16 }, 17 //点击添加销售品 18 addSales: function (e) { 19 var that = this; 20 var list = that.data.salesList; 21 var r = /^\+?[1-9][0-9]*$/; //正整数 22 var tip = '数量请输入正整数~~'; 23 for (var i = 0; i < list.length; ++i) { 24 if (list[i].nums <= 0 || !r.test(list[i].nums)) { 25 wx.showToast({ 26 title: tip, 27 image: '../Image/error.png', 28 duration: 2000 29 }); 30 return; 31 } 32 } 33 var options = this.data.objectArray 34 this.data.salesList.push({ id: options[0].id, nums: '', option: 0 }) //添加新行的时候nums初始为0 35 this.setData({ 36 salesList: this.data.salesList 37 }) 38 39 }, 40 //销售品申请类 41 bindPickerChange: function (e) { 42 var arr = this.data.objectArray //数组; 43 var value = e.detail.value; //数组子集 44 var list = this.data.salesList; //数组传递某一项的容器 45 var index = e.currentTarget.dataset.index; //索引 46 47 list[index] = arr[value] //被选中数组的某一项赋给容器的相对应的某一项容器 48 49 list[index].option = value //数组子集赋给某一项相对应的容器索引 50 this.setData({ 51 salesList: list 52 }) 53 }, 54 //申请数量 55 numChangeS: function (e) { 56 var _that = this; 57 var index = e.currentTarget.dataset.index; 58 var list = this.data.salesList 59 list[index].nums = e.detail.value 60 this.setData({ 61 salesList: list 62 }) 63 }, 64 65 // 页面初始化 options为页面跳转所带来的参数 66 onLoad: function (options) { 67 var that = this 68 wx.request({ 69 url: 'https://....', 70 method: 'GET', 71 header: { 'content-type': 'application/json' }, 72 data: {}, 73 success: function (res) { // success 74 var options = res.data.goods; 75 that.data.salesList.push({ id: options[0].id, nums: '', option: 0 }) 76 that.data.materielList.push({ id: options[0].id, nums: '', option: 0 }) 77 that.data.activesList.push({ id: options[0].id, option: 0 }) 78 that.setData({ 79 objectArray: options, 80 salesList: that.data.salesList, 81 }) 82 }, 83 }) 84 },
参考网址：https://www.cnblogs.com/JinQing/p/6673665.html