uniapp vue 多个picker 用同一个数组和@change事件的bindPickerChange方法，设置不同值和获取不同值的实现方法

uni-app picker通用方法、uniapp vue 多个picker 用同一个数组和@change事件的bindPickerChange方法，设置不同值和获取不同值的实现方法

页面：

<view class="demo-uni-col light"  v-for="cardIndex in uniCardList" :key="cardIndex">
<view style="border: none;">
<picker @change="bindPickerChange" :id="cardIndex" range-key="name" :range="array">
<view :class="['uni-input','room_'+cardIndex]" setValue="" >--</view>
</picker>
</view>

 

 

数组：

array: [{
name: '全部'
}, {
name: '美国'
}, {
name: '巴西'
}, {
name: '日本'
}],

 

方法：

bindPickerChange: function(e) {
console.log('picker发送选择改变，携带值为：' + JSON.stringify(e))
document.querySelector(".room_"+e.target.id).textContent=this.array[e.detail.value].name;
document.querySelector(".room_"+e.target.id).setAttribute("setValue", e.detail.value);
},