Exemple d'utilisation d'un sélecteur multi-colonnes à touches de plage dans l'applet WeChat-Développement de mini-programmes-php.cn

Exemple d'utilisation d'un sélecteur multi-colonnes à touches de plage dans l'applet WeChat

黄舟

Libérer： 2018-05-16 14:50:07

original

4687 Les gens l'ont consulté

Cet article présente principalement en détail comment utiliser la touche de plage du sélecteur multi-colonnes de l'applet WeChat. Il a une certaine valeur de référence. Les amis intéressés peuvent s'y référer

L'exemple de cet article. Nous avons partagé le code spécifique du sélecteur multicolonne de l'applet WeChat pour votre référence. Le contenu spécifique est le suivant

<picker mode="multiSelector" bindchange="bindMultiPickerChange2" bindcolumnchange="bindMultiPickerColumnChange2" value="{{multiIndex}}" range="{{objectMultiArray}}" range-key="{{&#39;name&#39;}}">
  <view class="picker">
   当前选择：{{objectMultiArray[0][multiIndex2[0]].name}}，{{objectMultiArray[1][multiIndex2[1]].name}}
  </view>
</picker>

Copier après la connexion

Page({
 /**
  * 页面的初始数据
  */
 data: {
  objectMultiArray: [
   [
    {
     id: 0,
     name: &#39;无脊柱动物&#39;
    },
    {
     id: 1,
     name: &#39;脊柱动物&#39;
    }
   ], [
    {
     id: 0,
     name: &#39;扁性动物&#39;
    },
    {
     id: 1,
     name: &#39;线形动物&#39;
    },
    {
     id: 2,
     name: &#39;环节动物&#39;
    },
    {
     id: 3,
     name: &#39;软体动物&#39;
    },
    {
     id: 3,
     name: &#39;节肢动物&#39;
    }
   ]
  ],
  multiIndex2: [0, 0],
 },


 bindMultiPickerChange2: function (e) {
  console.log(&#39;picker发送选择改变，携带值为&#39;, e.detail.value)
  this.setData({
   multiIndex2: e.detail.value
  })
 },
 bindMultiPickerColumnChange2: function (e) {
  console.log(&#39;修改的列为&#39;, e.detail.column, &#39;，值为&#39;, 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: &#39;扁性动物&#39; },
       { id: 1, name: &#39;线形动物&#39; },
       { id: 2, name: &#39;环节动物&#39; },
       { id: 3, name: &#39;软体动物&#39; },
       { id: 3, name: &#39;节肢动物&#39; }
      ];
      // data.multiArray[2] = [&#39;猪肉绦虫&#39;, &#39;吸血虫&#39;];
      break;
     case 1:
      data.objectMultiArray[1] = [
       { id: 0, name: &#39;鱼&#39; },
       { id: 1, name: &#39;线形两栖动物&#39; },
       { id: 2, name: &#39;爬行动物&#39; }
      ];
      break;
    }
    data.multiIndex2[1] = 0;
    // data.multiIndex[2] = 0;
    break;
  }
  this.setData(data);
 }


})

Copier après la connexion

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!