微信小程序一个页面中使用多个picker实现方法

如果两个picker使用同一个index,会出现一个改变之后，另一个picker也会改变的现象

所以要修改以下内容

下标：index   index2      绑定函数：bindPickerChange      bindPicker2Change

wxml:

<view class="section">
  <view class="section__title">普通选择器</view>
  <picker bindchange="bindPickerChange" value="{{index}}" range="{{array}}" style="border:#f00 solid 1px;">
    <view class="picker"  style="border:#f00 solid 1px;">
      当前选择：{{array[index]}}
    </view>
  </picker>
</view>


<view class="section">
  <view class="section__title">普通选择器</view>
  <picker bindchange="bindPicker2Change" value="{{index2}}" range="{{array2}}" style="border:#f00 solid 1px;">
    <view class="picker"  style="border:#f00 solid 1px;">
      当前选择：{{array2[index2]}}
    </view>
  </picker>
</view>

js:

Page({

  data: {
    array: ['美国', '中国', '巴西', '日本'],
    array2: ['美国2', '中国3', '巴西2', '日本2'],
    
    index: 0,
    index2:0,
 
  },

  bindPickerChange: function (e) {
    console.log('picker发送选择改变，携带值为', e.detail.value)
    this.setData({
      index: e.detail.value
    })
  },

  bindPicker2Change: function (e) {
    console.log('picker发送选择改变，携带值为', e.detail.value)
    this.setData({
      index2: e.detail.value
    })
  }
})