微信WXML文件屬于微信視圖層顯示文件,實際上是一段被微信封裝過的H5代碼,最終也是顯示在微信界面上,它的動態數據來自對應Page的data數據。
例如:(在wxml中顯示我的頭像,對應于page中的data數據(userInfo)),最終顯示效果如下圖。
%20%20 %20%20%20%20%20%20
大師 %20%20%20%20
//%20pages/start/index.jsPage({%20%20/**%20%20%20*%20頁面的初始數據%20%20%20*/%20%20data:%20{%20%20%20%20userInfo:%20{}%20%20},})
如何使用:
需要將要顯示的內容放入到雙引號之內<img src="{{userInfo.avatarUrl}}" />
這里我們可以使用組件屬性,控制屬性,直接使用關鍵字,邏輯運算,三元運算,算數運算,字符串運算,數組,組合等等
例如:
當Page中的data數據有更改的時候,wxml就會更新上面的數據顯示。
使用setData動態更新
this.setData({ tilesData: this.data.tilesData, itemSize: itemSize, score: 1, });
我們可以直接使用this.data.itemSize = itemSize,這樣設置會講data中的itemSize變量的值更改,但是不會在wxml中顯示出來,所以還需要setData,將需要變更的動態數據傳遞給wxml,wxml才會顯示出來。
新聞熱點
疑難解答