WXML (WeiXin Markup Language)是框架設(shè)計(jì)的一套標(biāo)記語言，用于渲染界面，WXML的渲染原理和React Native思路一致，通過一套標(biāo)記語言，在不同平臺(tái)被解析為不同端的渲染文件，如圖所示。
界面渲染示意圖
從圖中我們能看出，WXML語言最終會(huì)轉(zhuǎn)譯為宿主端對(duì)應(yīng)的語言，所以WXML中所使用的標(biāo)簽一定是小程序定義的標(biāo)簽，不能使用自定義標(biāo)簽，這樣才能保證頁面能被正確轉(zhuǎn)譯。使用微信開發(fā)者工具開發(fā)時(shí)，在WXML中編寫一些HTML標(biāo)簽或自定義標(biāo)簽仍然會(huì)被正常解析，這會(huì)給開發(fā)者造成一種小程序能直接支持HTML標(biāo)簽的誤解。這是因?yàn)槲⑿砰_發(fā)者工具內(nèi)核是瀏覽器內(nèi)核，同時(shí)小程序框架并沒對(duì)WXML中的標(biāo)簽和WXSS中的內(nèi)容進(jìn)行強(qiáng)驗(yàn)證，所以HTML和CSS能直接被解析，但這種不合法的WXML在手機(jī)端微信中是不能正常顯示的。開發(fā)過程中我們一定要拿真機(jī)進(jìn)行測(cè)試，保證程序能正常運(yùn)行。
WXML具有數(shù)據(jù)綁定、列表渲染、條件渲染、模板、事件等能力。
數(shù)據(jù)綁定
小程序中頁面渲染時(shí)，框架會(huì)將WXML文件同對(duì)應(yīng)Page的data進(jìn)行綁定，在頁面中我們可以直接使用data中的屬性。小程序的數(shù)據(jù)綁定使用Mustache語法(雙大括號(hào))將變量或簡(jiǎn)單的運(yùn)算規(guī)則包起來，主要有以下幾種渲染方式。
簡(jiǎn)單綁定是指我們使用Mustache語法(雙大括號(hào))將變量包起來，在模板中直接作為字符串輸出使用，可作用于內(nèi)容、組件屬性、控制屬性、關(guān)鍵字等輸出，其中關(guān)鍵字輸出是指將JavaScript中的關(guān)鍵字按其真值輸出。
您當(dāng)前瀏覽的文章：《微信小程序頁面結(jié)構(gòu)文件(WXML)解讀》由小程序開發(fā)服務(wù)品牌九尾狐整理發(fā)布。
轉(zhuǎn)載請(qǐng)注明：http://www.jytsl.com.cn/shows/6/19.html
文章標(biāo)簽：
