VantUI官網(wǎng)中給的示例是一個(gè)包含字符串的純數(shù)組，如圖所示：

但是大多時(shí)候，我們需要綁定的都是一個(gè)對(duì)象數(shù)組，如果直接使用的話，渲染的效果會(huì)顯示為[Object]。

這時(shí)可以利用van-picker自帶的 value-key 屬性，value-key屬性指選項(xiàng)對(duì)象中，選項(xiàng)文字對(duì)應(yīng)的鍵名。以下面的數(shù)據(jù)為例：

我們希望選擇器展示的是對(duì)象中的username屬性，則在van-picker中添加如下代碼：

這時(shí)可以看到選擇器已經(jīng)展示出username字段的內(nèi)容了：

Vant3中使用的是columns-field-names 屬性，可以自定義column結(jié)構(gòu)中的字段。比如想展示username字段，只需要添加如下代碼：

 :columns-field-names="{ text: 'username' }" 

除此之外，我們希望選擇的時(shí)候不止獲取每一列的索引值，還能獲取后臺(tái)對(duì)象中的id值。

這時(shí)就需要用到vant提供的事件。以confirm為例，當(dāng)我們點(diǎn)擊確定時(shí)，@confirm事件會(huì)觸發(fā)并傳回value和index兩個(gè)回調(diào)參數(shù)。

由于此時(shí)綁定的是對(duì)象數(shù)組，只需要通過value.xxx便可獲取我們想要的字段。如獲取id：