微信小程序下拉框之二維數組或對象

在項目中,咱們大多數時候傳的值並非須要這個下標,而是其餘的值。像我項目中,須要獲取到的是它對應的Id,那麼咱們如何經過它的這個下標值返回你想要的值呢?數組

經過picker返回的索引值,去獲取匹配你想獲取的值;this

js文件spa

Page({
    data:{
     //戶型   這是一個本地的對象,而後綁定到頁面上
    pic_array: [
      { id: 13, name: ‘1室1廳1衛‘ },
      { id: 14, name: ‘1室2廳1衛‘ },
      { id: 15, name: ‘2室1廳1衛‘ },
      { id: 16, name: ‘3室1廳2衛‘ },
      { id: 17, name: ‘4室1廳2衛‘ },
      { id: 18, name: ‘5室1廳3衛‘ },
      { id: 19, name: ‘6室1廳3衛‘ },
      { id: 20, name: ‘7室以上‘ },
    ],
     hx_index: 0;
   }, 
     bindPickerChange_hx: function (e) {
     console.log(‘picker發送選擇改變,索引爲‘, e.detail.value);
     this.setData({   //給變量賦值
    var id = this.data.pic_array[e.detail.value].id //根據索引去查對應的id
     hx_index: e.detail.value,  //每次選擇了下拉列表的內容同時修改下標而後修改顯示的內容,顯示的內容和選擇的內容一致
    })
     console.log(‘id爲:‘, id);
    },
})

wxmlcode

      <picker name="picker_hx" class="cybm_pic_1" data-id="{{pic_array[hx_index].id}}" range="{{pic_array}}" range-key="{{‘name‘}}"  bindchange="bindPickerChange_hx"  >
        <view class="picker" >
         戶型:  {{pic_array[hx_index].name}} //指定數組中指定下標的name鍵對應的值 
        </view>
      </picker>
屬性名range  類型Array/Object Array  存放你的本地數據數組或者對象數組,須要加載的數據
屬性名range-key  類型String  當 range 是一個 二維Object Array 時,經過 range-key 來指定 Object 中 key 的值做爲選擇器顯示內容
屬性名value  類型Array  value 每一項的值表示選擇了 range 對應項中的第幾個(下標從 0 開始)
屬性名data-  類型自定義屬性後更的屬性名字能夠自定義 當你須要設置其餘值得時候能夠使用  可選
相關文章
相關標籤/搜索