|
作者:萌神哆啦A夢(mèng),來自原文地址 一:wx:for的使用在小程序的開發(fā)過程中,經(jīng)常會(huì)用到在前端頁面循環(huán)打印一個(gè)數(shù)組或者對(duì)象的數(shù)據(jù),這樣的話就需要用wx:for來實(shí)現(xiàn)。 一般情況下,小程序的utils這個(gè)文件夾下,我們可以把本地的數(shù)據(jù)寫進(jìn)去,封裝成.js文件,提供對(duì)外暴露的接口,然后讀取本地?cái)?shù)據(jù),這些在上一篇博客中有詳細(xì)介紹。我們最后說到寫好的本地?cái)?shù)據(jù)可以另一個(gè)頁面讀?。?/p>
在data{}中賦值后,showData就可以直接在wxml中顯示了。接下來說下如何在wxml頁面用wx:for循環(huán)顯示數(shù)組,下面是示例:
wx:for = “”,“”中寫當(dāng)前小程序js頁面中data的對(duì)象名。 實(shí)際效果圖(并非上述代碼實(shí)現(xiàn)): 二:小程序的動(dòng)態(tài)傳參在微信小程序的開發(fā)過程中經(jīng)常會(huì)用到動(dòng)態(tài)傳參,比如根據(jù)某一頁面?zhèn)鲄⒌牟煌?,加載不同的新的頁面。接下來介紹下如何實(shí)現(xiàn)。 上一篇博客中介紹了如何用wx:for循環(huán)顯示數(shù)組,一般情況下我們要實(shí)現(xiàn)的功能是點(diǎn)擊不同的元素進(jìn)入不同的頁面,比如在另一個(gè)頁面加載某個(gè)元素的詳細(xì)信息。 跳轉(zhuǎn)這里采用navigator跳轉(zhuǎn),在navigator跳轉(zhuǎn)的鏈接上將參數(shù)加上去: index.wxml(根據(jù)點(diǎn)擊頁面的不同傳遞參數(shù))
id是在本地?cái)?shù)據(jù)中已經(jīng)寫好的,參見以前的博客,它也對(duì)應(yīng)了每一條數(shù)據(jù)其他詳細(xì)信息。由此可以想到,我們只要在下一級(jí)頁面根據(jù)傳遞參數(shù)id再在本地?cái)?shù)據(jù)中查詢,然后將查詢結(jié)果進(jìn)行顯示,就做到了加載詳細(xì)信息這個(gè)功能。 logs.js(接受index.wxml傳遞的參數(shù)并處理)
searchmtdata這個(gè)方法在之前的博客中已經(jīng)有說明,就是根據(jù)id的值來查詢,返回一個(gè)list中具體的對(duì)象,即某個(gè)item的詳細(xì)信息。 onLoad:function這個(gè)函數(shù)在頁面加載時(shí)就會(huì)執(zhí)行一次,options就是接收的從index.wxml傳遞過來的參數(shù)。根據(jù)id查詢到具體的list對(duì)象后再進(jìn)行賦值,此時(shí)data_**中的數(shù)據(jù)就是某個(gè)item的詳細(xì)信息了。 logs.wxml(對(duì)item的詳細(xì)信息進(jìn)行顯示)
實(shí)現(xiàn)效果截圖: 點(diǎn)擊具體某個(gè)item |