小程序自定义滑动选择项

<view class='seldate'>
  <image src='../../images/z-2.png'></image>
  <text>选择时间</text>
  <picker mode="multiSelector" bindchange="bindMultiPickerChange" value="" range="">
    <view class="picker"></view>
  </picker>
</view>

Page({
  data: {
    multiArray: [
      ['29', '30'], 
      ['08:00', '09:00', '10:00', '11:00', '12:00'], 
      ['13:00', '14:00', '15:00', '16:00', '17:00']
    ],
    objectMultiArray: [
      [
        { id: 0, name: '2019-08-29'},
        { id: 1, name: '2019-08-30'}
      ], [
        { id: 0, name: '08:00'},
        { id: 1, name: '09:00'},
        { id: 2, name: '10:00'},
        { id: 3, name: '11:00'},
        { id: 4, name: '12:00'}
      ], [
        { id: 0, name: '13:00'},
        { id: 1, name: '14:00'},
        { id: 2, name: '15:00'},
        { id: 3, name: '16:00'},
        { id: 4, name: '17:00'}
      ]
    ],
    multiIndex: [0, 0, 0],
  },
  bindMultiPickerChange: function (e) {
    var that = this;
    console.log('picker发送选择改变，携带值为', e.detail.value[0], e.detail.value[1],e.detail.value[2])
    console.log(that.data.objectMultiArray[0][e.detail.value[0]].name)
    console.log(that.data.objectMultiArray[1][e.detail.value[1]].name)
    console.log(that.data.objectMultiArray[2][e.detail.value[2]].name)

    that.setData({
      multiIndex: e.detail.value
    })
  },
  onShow(){
  
  },
  onLoad(){
  
  }
})

.seldate{width: 100%;height: 120rpx;color: #45c3ff;font-size: 36rpx;text-align: center;position: fixed;bottom: 60rpx;}
.seldate image{width: 30rpx;height: 32rpx;}
.seldate text{display: block;}
.seldate picker{position: absolute;top: 0;left: 0;right: 0;bottom: 0;z-index: 8;height: 120rpx;}
.seldate picker .picker{width: 100%;height: 120rpx;}