看到很多人在问这个问题,我来写一下吧
wxml:
<view class="container log-list"> <!--身份选择1 --> <view class="section identity-select"> <picker bindchange="bindPickerChange" value="{{index}}" range="{{array}}"> <view class="picker"> {{array[index]}}日报 </view> </picker> </view> <!--身份选择2 --> <view class="section identity-select"> <picker bindchange="bindPickerChangef" value="{{index1}}" range="{{array}}"> <view class="picker"> {{array[index1]}} </view> </picker> </view> </view>
js:
const util = require('../../utils/util.js')
Page({
data: {
primarySize: 'default',
array: ['夏彤','陈学华','甘广','黄龙流','李昌略','董俊辉','罗景盛','钟敏君','林锐','麦健发','曹兵'],
objectArray: [
{
id: 0,
name: '夏彤'
},
{
id: 1,
name: '陈学华'
},
{
id: 2,
name: '甘广'
},
{
id: 3,
name: '黄龙流'
},
{
id: 4,
name: '李昌略'
},
{
id: 5,
name: '董俊辉 '
},
{
id: 6,
name: '罗景盛'
}
,
{
id: 7,
name: '钟敏君'
}
,
{
id: 8,
name: '林锐'
}
,
{
id: 9,
name: '麦健发'
}
,
{
id: 10,
name: '曹兵'
}
],
index: 0,
index1: 0,
},
//身份选择1
bindPickerChange: function (e) {
console.log('picker发送选择改变,携带值为', this.data.array[e.detail.value])
this.setData({
index: e.detail.value
})
},
bindPickerChangef: function (e) {
console.log('picker发送选择改变,携带值为', this.data.array[e.detail.value])
this.setData({
index1: e.detail.value
})
}
}
上面要改的地方,也就是多个普通选择器之间的差异就是黑色背景白色的那几个参数,即事件名字,下标:效果如下图
喜欢这个回答可以关注微信公众号,前端周末,分享更多前端,慕课资料。