我們在操作 picker 組件的時候 可能會有疑惑，為什么會出現(xiàn)渲染問題，或者我就是想取中文的值，怎么辦？視圖層數(shù)據(jù)是json的，直接展示 picker使用說明：
{
{
school}
}
'
model:value="{
{
currentSchool}
}
" bindchange="handleChange" > 當前選擇 {
{
school[currentSchool].valuess}
}
邏輯層page({
data: {
school: [ {
"isNewRecord":false,"id":"2","keyss":"school","valuess":"湖南小學"}
, {
"isNewRecord":false,"id":"3","keyss":"school","valuess":"北京小學"}
], currentSchool: "" }
handleChange(e) {
console.log(e) // 如果 range是一個 Object Array形式的，那這里的value就是索引下標 let currentVal = e.detail.value // 對應(yīng)的中文是 let text = this.data.school[currentVal].valuess console.log('
中文-->'
, text) }
, }
)這里，我們傳入的是一個數(shù)組對象 Object Array類型， 那么我們在使用picker組件的時候，一定要分清，這些字段的意思，以及如何取值range-key 是告訴我們，在渲染的時候，是以什么字段取值，下面就是不指定的情況，如果是很簡單的數(shù)據(jù)結(jié)構(gòu)類似：
school: ["中文", '
數(shù)學'
, "音樂"]是不需要指定的，對于復(fù)雜的數(shù)據(jù)結(jié)構(gòu)，指定字段，微信會自動幫我們?nèi)ベx值作者：
知了清語model:value="{
{
currentSchool}
}
" 你可能會發(fā)現(xiàn)這個，為什么value前面綁定了model因為微信不是雙向數(shù)據(jù)綁定的，如果單純的寫 value="{
{
當前選中的索引下標-currentSchool}
}
"邏輯層的currentSchool 是不會有變化的，必須通過 bindchange事件去修改 data中的數(shù)據(jù), 像下面這樣handleChange(e) {
this.setData({
currentSchool: e.detail.value }
) }
使用model的好處 就在于 我們不需要關(guān)系這個賦值操作，只要我們點擊右上角的確定，data中的 currentSchool就更新了，點擊取消是不會更新data中的數(shù)據(jù)的我們在 handleChange中的 e.detail.value 拿到的值也就是個下標，其實我們可能會想要text文本就直接像上面那樣，用索引去取源數(shù)據(jù)中的 {
}
對象屬性還有一種常見的操作，就是將 school--schoolFilter變成 ["湖南小學", "北京小學"] 這種簡單結(jié)構(gòu)，那么e.detail.value 獲取的就是中文但是這種要求，data中有2個數(shù)組 schoolFilter--Array類型的 和school--Object Array類型的， picker中用 range = "{
{
schoolFilter}
}
"那么要獲取源數(shù)據(jù)的其他屬性，就必須遍歷school 再取值總結(jié)不想去寫bindchange更改 data數(shù)據(jù)，就使用 model:picker 開始標簽和結(jié)束標簽 中包裹只是選擇以后的內(nèi)容，你可以隨意去組織用 text呈現(xiàn)或者 {
{
內(nèi)容}
}
呈現(xiàn) 或者 view 呈現(xiàn) 或者 input 呈現(xiàn) 都可以獲取Object Array中的其他字段，如果不想過濾數(shù)據(jù)，就使用 Object Array這種結(jié)構(gòu)，就通過索引下班去訪問，不需要在data中建2個字段只有點擊 picker中顯示的 【確定】按鈕，picker中的數(shù)據(jù)才會更新推薦教程：
《微信小程序》以上就是小程序之picker 數(shù)據(jù)是 Object Array的詳細內(nèi)容，更多請關(guān)注php中文網(wǎng)其它相關(guān)文章！
微信
分享相關(guān)標簽：
微信小程序本文轉(zhuǎn)載于：
掘金社區(qū)，如有侵犯，請聯(lián)系[email protected]刪除
上一篇：
一款小而美小程序腳手架，讓你更流暢快速的開發(fā)小程序
下一篇：
小程序入門就看這篇相關(guān)文章相關(guān)視頻微信小程序圖片無法顯示怎么辦？自學微信小程序從零到一：
項目構(gòu)建后http請求封裝微信小程序-canvas生成圖片并保存到本地怎么退出微信小程序的登錄？小程序之picker 數(shù)據(jù)是 Object Arr...初識微信小程序(1)初識微信小程序(4)深入了解微信小程序(三) [溫州做小程序]