這篇文章主要為大家展示了“微信小程序picker組件中如何綁定objectArray數據類型”，內容簡而易懂，條理清晰，希望能夠幫助大家解決疑惑，下面讓小編帶領大家一起研究并學習一下“微信小程序picker組件中如何綁定objectArray數據類型”這篇文章吧。
介紹：
普通選擇器：mode = selector
| 屬性名 | 類型 | 默認值 | 說明 | |
|---|---|---|---|---|
| range | Array / Object Array | [] | mode為 selector 或 multiSelector 時，range 有效 | |
| range-key | String | 當 range 是一個 Object Array 時，通過 range-key 來指定 Object 中 key 的值作為選擇器顯示內容 | ||
| value | Number | 0 | value 的值表示選擇了 range 中的第幾個（下標從 0 開始） | |
| bindchange | EventHandle | value 改變時觸發 change 事件，event.detail = {value: value} | ||
| disabled | Boolean | false | 是否禁用 |
首先我的數據格式是：[{ name: '服務質量', id: 20 }, { name: '服務品質', id: 24 }, { name: '服務速度', id: 25}]
.wxml頁代碼：
//其中range為數據源，value為下標索引，bindchange為change改變事件
<picker range='{{type}}' value='{{idx}}' bindchange='Change' range-key="name" data-id='{{type[index].id}}'>
<view class='picker'>{{type[index].name}}</view>
</picker>.js代碼：
/**
* 頁面的初始數據
*/
data: {
type: [{ name: '服務質量', id: 20 }, { name: '服務品質', id: 24 }, { name: '服務速度', id: 25}],
index: 0,//索引
},
Change: function (e) {
console.log('picker發送選擇改變，索引值為', e.detail.value)
console.log("選中的id值:"+e.target.dataset.id)
console.log(e);
this.setData({
index: e.detail.value
})
}頁面效果和輸出結果：
以上是“微信小程序picker組件中如何綁定objectArray數據類型”這篇文章的所有內容，感謝各位的閱讀！相信大家都有了一定的了解，希望分享的內容對大家有所幫助，如果還想學習更多知識，歡迎關注億速云行業資訊頻道！
免責聲明：本站發布的內容（圖片、視頻和文字）以原創、轉載和分享為主，文章觀點不代表本網站立場，如果涉及侵權請聯系站長郵箱：is@yisu.com進行舉報，并提供相關證據，一經查實，將立刻刪除涉嫌侵權內容。
