picker
从底部弹起的滚动选择器,现支持五种选择器,通过mode来区分,分别是普通选择器,多列选择器,时间选择器,日期选择器,省市区选择器,默认是普通选择器。
wxml:
普通选择器(mode = selector)
<view class='cell-picker'>
<view class='cell-name'>chengshi</view> <view class='cell-val'> <picker mode = "selector" bindchange="bindPickerChangeType" range-key="{ {'Name'}}" value="{ { indexType}}" range="{ {array}}">{ { array[indexType].Name}}</picker> </view> </view>mode = selector:普通选择器
bindchange:value 改变时触发 change 事件
range-key: 当 range 是一个 Object Array 时,通过 range-key 来指定 Object 中 key 的值作为选择器显示内容
value: value 的值表示选择了 range 中的第几个(下标从 0 开始)
range: mode为 selector 或 multiSelector 时,range 有效。
data:{
array: [
{
" Name": "shanghai",
"Id": "020"
}, {
"Name": "beijing ",
"Id": "005"
}, {
"Name": "tianjin",
"Id": "030"
}
],
indexType: 0, //选择了 range 中的第几个(下标从 0 开始)
}
//点击
bindPickerChangeType: function (e) {
console.log('picker发送选择改变,携带值为', e.detail.value)
this.setData({
indexType: e.detail.value
})
},