看到很多人在问这个问题,我来写一下吧
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 }) } }
上面要改的地方,也就是多个普通选择器之间的差异就是黑色背景白色的那几个参数,即事件名字,下标:效果如下图
喜欢这个回答可以关注微信公众号,前端周末,分享更多前端,慕课资料。