zoukankan      html  css  js  c++  java
  • 微信小程序多列选择器之range-key

    <picker mode="multiSelector" bindchange="bindMultiPickerChange2" bindcolumnchange="bindMultiPickerColumnChange2" value="{{multiIndex}}" range="{{objectMultiArray}}" range-key="{{'name'}}">
       <view class="picker">
          当前选择:{{objectMultiArray[0][multiIndex2[0]].name}},{{objectMultiArray[1][multiIndex2[1]].name}}
       </view>
    </picker>

    Page({
    
      /**
       * 页面的初始数据
       */
      data: {
        objectMultiArray: [
          [
            {
              id: 0,
              name: '无脊柱动物'
            },
            {
              id: 1,
              name: '脊柱动物'
            }
          ], [
            {
              id: 0,
              name: '扁性动物'
            },
            {
              id: 1,
              name: '线形动物'
            },
            {
              id: 2,
              name: '环节动物'
            },
            {
              id: 3,
              name: '软体动物'
            },
            {
              id: 3,
              name: '节肢动物'
            }
          ]
        ],
        multiIndex2: [0, 0],
      },
    
    
      bindMultiPickerChange2: function (e) {
        console.log('picker发送选择改变,携带值为', e.detail.value)
        this.setData({
          multiIndex2: e.detail.value
        })
      },
      bindMultiPickerColumnChange2: function (e) {
        console.log('修改的列为', e.detail.column, ',值为', e.detail.value);
        var data = {
          objectMultiArray: this.data.objectMultiArray,
          multiIndex2: this.data.multiIndex2
        };
        data.multiIndex2[e.detail.column] = e.detail.value;
        switch (e.detail.column) {
          case 0:
            switch (data.multiIndex2[0]) {
              case 0:
                data.objectMultiArray[1] = [
                  { id: 0, name: '扁性动物' },
                  { id: 1, name: '线形动物' },
                  { id: 2, name: '环节动物' },
                  { id: 3, name: '软体动物' },
                  { id: 3, name: '节肢动物' }
                ];
                // data.multiArray[2] = ['猪肉绦虫', '吸血虫'];
                break;
              case 1:
                data.objectMultiArray[1] = [
                  { id: 0, name: '鱼' },
                  { id: 1, name: '线形两栖动物' },
                  { id: 2, name: '爬行动物' }
                ];
                break;
            }
            data.multiIndex2[1] = 0;
            // data.multiIndex[2] = 0;
            break;
        }
        this.setData(data);
      }
    
     
    })
    
    

    请记得点赞额!!!请记得点赞额!!!请记得点赞额!!!请记得点赞额!!!请记得点赞额!!!请记得点赞额!!!请记得点赞额!!!请记得点赞额!!!请记得点赞额!!!请记得点赞额!!!请记得点赞额!!!请记得点赞额!!!请记得点赞额!!!请记得点赞额!!!请记得点赞额!!!请记得点赞额!!!请记得点赞额!!!请记得点赞额!!!请记得点赞额!!!请记得点赞额!!!请记得点赞额!!!请记得点赞额!!!

     
  • 相关阅读:
    Golang之字符串格式化
    BZOJ 4513: [Sdoi2016]储能表 [数位DP !]
    BZOJ 3329: Xorequ [数位DP 矩阵乘法]
    BZOJ 1833: [ZJOI2010]count 数字计数 [数位DP]
    HDU2089 不要62 BZOJ1026: [SCOI2009]windy数 [数位DP]
    未完
    [Miller-Rabin & Pollard-rho]【学习笔记】
    BZOJ 3551: [ONTAK2010]Peaks加强版 [Kruskal重构树 dfs序 主席树]
    BZOJ 3123: [Sdoi2013]森林 [主席树启发式合并]
    BZOJ 3545: [ONTAK2010]Peaks [Splay启发式合并]
  • 原文地址:https://www.cnblogs.com/Oopa/p/7266976.html
Copyright © 2011-2022 走看看