网友真实露脸自拍10p,成人国产精品秘?久久久按摩,国产精品久久久久久无码不卡,成人免费区一区二区三区

小程序模板網(wǎng)

微信小程序之?dāng)?shù)據(jù)雙向綁定與數(shù)據(jù)操作,點(diǎn)擊列表的item帶參數(shù)跳轉(zhuǎn)界面 ...

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

分享者:道之道編程路,來(lái)自原文地址

 

一:數(shù)據(jù)雙向綁定與數(shù)據(jù)操作

數(shù)據(jù)雙向綁定是指js部分?jǐn)?shù)據(jù)發(fā)生變化是html部分的數(shù)據(jù)也會(huì)發(fā)生變化,當(dāng)然html部分?jǐn)?shù)據(jù)發(fā)生變化js部分?jǐn)?shù)據(jù)也會(huì)發(fā)生變化,從而使界面很方便的實(shí)現(xiàn)動(dòng)態(tài)數(shù)據(jù)顯示,一般擁有數(shù)據(jù)雙向綁定的前端框架都為mvvm結(jié)構(gòu)。數(shù)據(jù)雙向綁定是個(gè)好東西,an1 an2 vue 也都有數(shù)據(jù)雙向綁定的機(jī)制,而且基本都差不多,抄來(lái)抄去嘛!!下面以一個(gè)列表為例子來(lái)說(shuō)下數(shù)據(jù)雙向綁定及數(shù)據(jù)的操作。

1.把要進(jìn)行數(shù)據(jù)雙向綁定的屬性放在page的data里,然后在html里使用{{屬性名}}即可進(jìn)行數(shù)據(jù)顯示; 
2.that.setData({ synctable:res.data.data.list }); 使用setData方法給synctable:res賦值并更新界面相應(yīng)數(shù)據(jù)。 
3.for(var i=0;that.data.synctable.length>i;i++){ that.data.synctable[i].top=i*40; } 使用 that.data.synctable取到data里的synctable值然后添加上top新字段,然后使用style="top:{{item.top}}px;" 即可在js動(dòng)態(tài)控制樣式屬性(使用這種方法控制樣式只是為了實(shí)現(xiàn)拖拽列表,一般并不這樣控制樣式)

 

二:點(diǎn)擊列表的item帶參數(shù)跳轉(zhuǎn)界面

1.在js文件里寫個(gè)界面跳轉(zhuǎn)的事件處理函數(shù)gotableinfo,var index = parseInt(e.currentTarget.dataset.index); 為獲取當(dāng)前點(diǎn)擊列表的下腳標(biāo),wx.navigateTo為小程序提供的界面路由跳轉(zhuǎn)的方法,參數(shù)url為要跳轉(zhuǎn)頁(yè)面的連接(?后面為連接攜帶的參數(shù)) 

 
2.data-index="{{index}}"為標(biāo)記列表的下腳標(biāo),index的來(lái)源與wx:for="{{synctable}}"的列表渲染有關(guān) 默認(rèn)列表下角標(biāo)為index 列表內(nèi)容為item 

3.從options.thumb_upid獲取前一個(gè)頁(yè)面所傳參數(shù) 



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