小程序模板網(wǎng)

微信小程序循環(huán)以及嵌套循環(huán)的總結(jié)

發(fā)布時(shí)間:2018-04-25 08:53 所屬欄目:小程序開(kāi)發(fā)教程

關(guān)于微信小程序,最近被安排做微信小程序,首次接觸,總體來(lái)說(shuō)上手不是太困難。 對(duì)于小程序的循環(huán)問(wèn)題頗有感觸,因?yàn)樽约航壎〝?shù)據(jù)到界面無(wú)數(shù)次用到循環(huán)和嵌套循環(huán)。 對(duì)于我們?cè)趈s中從接口中通過(guò)POST或GET請(qǐng)求獲取數(shù)據(jù)存放到Page中定義的對(duì)象中:

 

				
  1. //首頁(yè)話題列表
  2. wx.request({
  3. url: 'https://*******************',
  4. method: 'POST',
  5. data: {
  6. pageNum: 1,
  7. pageSize: 10
  8. },
  9. success:function(res){
  10. that.setData({
  11. listTop:res.data,
  12.  
  13. })
  14. }
  15. })

在wxml文件中通過(guò) wx:for="{{listTop}}"  來(lái)實(shí)現(xiàn)循環(huán)輸出對(duì)象中的數(shù)據(jù),這里我們可以通過(guò){{index }} 獲取下標(biāo),也可以自定義下標(biāo):

wx:for-index="index2"

當(dāng)listTop中存在對(duì)象com的時(shí)候,我們可以通過(guò)wx:for="{{item.com}}" 來(lái)實(shí)現(xiàn)循環(huán)該循環(huán)中的數(shù)據(jù)。

我在實(shí)際的項(xiàng)目中,遇到這樣一個(gè)問(wèn)題:在嵌套循環(huán)的過(guò)程中,我需要將某個(gè)字段的值進(jìn)行轉(zhuǎn)換,比如時(shí)間戳換成日期/幾天前等,這個(gè)時(shí)候我們應(yīng)該

知道微信小程序不支持界面直接調(diào)用JS,這個(gè)時(shí)候我們應(yīng)該怎么解決:

起初自己饒了很大一個(gè)彎子,我總是想在JS中通過(guò)循環(huán)放到一個(gè)對(duì)象中,然后再在界面循環(huán)出來(lái),其實(shí)前一步我已經(jīng)接近結(jié)果了,但是實(shí)際開(kāi)發(fā)中

自己作為剛?cè)肼毑坏揭粋€(gè)月的新手還是有很多不足,所以自己陷入到死循環(huán)當(dāng)中。

解決方案:在你遍歷出來(lái)的時(shí)候,直接把原有的數(shù)據(jù)替換成想要的數(shù)據(jù)就行了。。。。(很簡(jiǎn)單,但是當(dāng)局者迷,但是由于自己解決的,可能存在

更好的方法,這里僅作敘述)

 

				
  1. for (var i = 0; i < res.data.data.length;i++){
  2. console.log(res.data.data[i].comments+"**********"+i)
  3.  
  4. console.log("***"+i)
  5. if (res.data.data[i].comments !=null){
  6. for (var j = 0; j < res.data.data[i].comments.length;j++){
  7. res.data.data[i].comments[j].createTime=transDate(res.data.data[i].comments[j].createTime)
  8. }
  9. }
  10. }


易優(yōu)小程序(企業(yè)版)+靈活api+前后代碼開(kāi)源 碼云倉(cāng)庫(kù):starfork
本文地址:http://www.u-renovate.com/wxmini/doc/course/23946.html 復(fù)制鏈接 如需定制請(qǐng)聯(lián)系易優(yōu)客服咨詢:800182392 點(diǎn)擊咨詢
QQ在線咨詢
AI智能客服 ×