微信小程序-二级联动、时间选择器（只精确到分）

最新推荐文章于 2023-12-19 14:41:30 发布

chibimarukochan

最新推荐文章于 2023-12-19 14:41:30 发布

阅读量3.9k

点赞数 2

分类专栏：微信小程序文章标签：二级联动时间选择器

本文链接：https://blog.csdn.net/chibimarukochan/article/details/88887226

版权

本文介绍了微信小程序中如何实现二级联动效果及时间选择器的使用，详细讲解了实现步骤，并提供了dateTimePicker.js的相关内容。

摘要由CSDN通过智能技术生成

一、二级联动

1）效果

2）实现

<view class="section">
    <picker
      mode="multiSelector"
      bindchange="bindMultiPickerChange"
      bindcolumnchange="bindMultiPickerColumnChange"
      value="{
  {multiIndex}}"
      range="{
  {multiArray}}"
    >
      <view class="picker">
        当前选择：{
  {multiArray[0][multiIndex[0]]}}，{
  {multiArray[1][multiIndex[1]]}}
      </view>
    </picker>
</view>

data:{
 multiArray: [['宴会庆典', '峰会论坛', '商业活动'], ["协会活动", "慈善活动", "答谢活动", "区块链", "人工智能", "大数据", "品牌推广", "开业庆典", "展会活动"]],
 multiIndex: [0, 0],
},

  bindMultiPickerChange(e) {
    this.setData({
      multiIndex: e.detail.value
    })
  },
  bindMultiPickerColumnChange(e) {
    const data = {
      multiArray: this.data.multiArray,
      multiIndex: this.data.multiIndex
    }
    data.multiIndex[e.detail.column] = e.detail.value
    switch (e.detail.column) {
      case 0:
        switch (data.multiIndex[0]) {
          case 0: