微信小程序 WXML

WXML

WXML(WeiXin Markup Language)是框架設(shè)計的一套標(biāo)簽語言泽铛,結(jié)合基礎(chǔ)組件垃瞧、事件系統(tǒng)闹炉,可以構(gòu)建出頁面的結(jié)構(gòu)懈糯。

用以下一些簡單的例子來看看WXML具有什么能力:、

數(shù)據(jù)綁定

<!--wxml-->

<view>{{message}}</view>

//page.js

page({

? ? data:{

? ??????????message:'Hello MINA!'

? ? ? ? ? ? }

})

列表渲染

<view wx:for-items="{{array}}"></view>

//page.js

Page({

data: {

????????array: [1,2,3,4,5]

????????}

})

條件渲染

<view ?wx:if = "{{view=='WEBVIEW'}}">WEBVIEW </view>

<view wx:elif=“{{view == 'app'}}”>app</view>

<view ?wx:else = "{{mina}}">mina</view>

//page.js

page({

? ? data:{

????????????view:'mina'

? ? ? ? ? ? }

})

模板

<template name =" staffName">

????<view>?

? ? ? ? Firstname:{{firstname:'xiaoming'}},Lastname:{{lastname:'xiaohong'}}

? ? </view>

</template>

直接引用:<template ?is="staffName" data = "{{...staffA}}"></template>

//page.js

page({

? ? data:{

? ? ? ? ? ? staffA:{firstname:'xiaowei',lastname:'xiaowang'},

????????????staffB:{firstname:'xiaolu',lastname:'honhhuang'},

? ? ? ? ? ? staffC:{firsrtname:'xiaohuang',lastname:'xiaoping'}

}

})

WXML 引用

import 可以在當(dāng)前文件中使用目標(biāo)文件定義的 template

在 item.wxml 中定義了一個 item 的 template

<!--item.wxml-->

<template name="item">

? ? ? ? <text>{{text}}</text>

</template>

在 index.wxml 中引用 item.wxml颁督,就可以使用 item 的模板

<import src="item.wxml">

<template is="item" data="{{text:"aa2"}}"><template>

?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請聯(lián)系作者
  • 序言:七十年代末践啄,一起剝皮案震驚了整個濱河市,隨后出現(xiàn)的幾起案子沉御,更是在濱河造成了極大的恐慌屿讽,老刑警劉巖,帶你破解...
    沈念sama閱讀 211,639評論 6 492
  • 序言:濱河連續(xù)發(fā)生了三起死亡事件吠裆,死亡現(xiàn)場離奇詭異伐谈,居然都是意外死亡,警方通過查閱死者的電腦和手機硫痰,發(fā)現(xiàn)死者居然都...
    沈念sama閱讀 90,277評論 3 385
  • 文/潘曉璐 我一進店門,熙熙樓的掌柜王于貴愁眉苦臉地迎上來窜护,“玉大人效斑,你說我怎么就攤上這事≈悖” “怎么了缓屠?”我有些...
    開封第一講書人閱讀 157,221評論 0 348
  • 文/不壞的土叔 我叫張陵奇昙,是天一觀的道長。 經(jīng)常有香客問我敌完,道長储耐,這世上最難降的妖魔是什么? 我笑而不...
    開封第一講書人閱讀 56,474評論 1 283
  • 正文 為了忘掉前任滨溉,我火速辦了婚禮什湘,結(jié)果婚禮上,老公的妹妹穿的比我還像新娘晦攒。我一直安慰自己闽撤,他們只是感情好,可當(dāng)我...
    茶點故事閱讀 65,570評論 6 386
  • 文/花漫 我一把揭開白布脯颜。 她就那樣靜靜地躺著哟旗,像睡著了一般。 火紅的嫁衣襯著肌膚如雪栋操。 梳的紋絲不亂的頭發(fā)上闸餐,一...
    開封第一講書人閱讀 49,816評論 1 290
  • 那天,我揣著相機與錄音矾芙,去河邊找鬼舍沙。 笑死,一個胖子當(dāng)著我的面吹牛蠕啄,可吹牛的內(nèi)容都是我干的场勤。 我是一名探鬼主播,決...
    沈念sama閱讀 38,957評論 3 408
  • 文/蒼蘭香墨 我猛地睜開眼歼跟,長吁一口氣:“原來是場噩夢啊……” “哼和媳!你這毒婦竟也來了?” 一聲冷哼從身側(cè)響起哈街,我...
    開封第一講書人閱讀 37,718評論 0 266
  • 序言:老撾萬榮一對情侶失蹤留瞳,失蹤者是張志新(化名)和其女友劉穎,沒想到半個月后骚秦,有當(dāng)?shù)厝嗽跇淞掷锇l(fā)現(xiàn)了一具尸體她倘,經(jīng)...
    沈念sama閱讀 44,176評論 1 303
  • 正文 獨居荒郊野嶺守林人離奇死亡,尸身上長有42處帶血的膿包…… 初始之章·張勛 以下內(nèi)容為張勛視角 年9月15日...
    茶點故事閱讀 36,511評論 2 327
  • 正文 我和宋清朗相戀三年作箍,在試婚紗的時候發(fā)現(xiàn)自己被綠了硬梁。 大學(xué)時的朋友給我發(fā)了我未婚夫和他白月光在一起吃飯的照片。...
    茶點故事閱讀 38,646評論 1 340
  • 序言:一個原本活蹦亂跳的男人離奇死亡胞得,死狀恐怖荧止,靈堂內(nèi)的尸體忽然破棺而出,到底是詐尸還是另有隱情,我是刑警寧澤跃巡,帶...
    沈念sama閱讀 34,322評論 4 330
  • 正文 年R本政府宣布危号,位于F島的核電站,受9級特大地震影響素邪,放射性物質(zhì)發(fā)生泄漏外莲。R本人自食惡果不足惜,卻給世界環(huán)境...
    茶點故事閱讀 39,934評論 3 313
  • 文/蒙蒙 一兔朦、第九天 我趴在偏房一處隱蔽的房頂上張望偷线。 院中可真熱鬧,春花似錦烘绽、人聲如沸淋昭。這莊子的主人今日做“春日...
    開封第一講書人閱讀 30,755評論 0 21
  • 文/蒼蘭香墨 我抬頭看了看天上的太陽翔忽。三九已至,卻和暖如春盏檐,著一層夾襖步出監(jiān)牢的瞬間歇式,已是汗流浹背。 一陣腳步聲響...
    開封第一講書人閱讀 31,987評論 1 266
  • 我被黑心中介騙來泰國打工胡野, 沒想到剛下飛機就差點兒被人妖公主榨干…… 1. 我叫王不留材失,地道東北人。 一個月前我還...
    沈念sama閱讀 46,358評論 2 360
  • 正文 我出身青樓硫豆,卻偏偏與公主長得像龙巨,于是被迫代替她去往敵國和親。 傳聞我的和親對象是個殘疾皇子熊响,可洞房花燭夜當(dāng)晚...
    茶點故事閱讀 43,514評論 2 348

推薦閱讀更多精彩內(nèi)容

  • WXML 一 數(shù)據(jù)綁定 1 簡單綁定 (1)內(nèi)容 (2)組件屬性(需要在雙括號中) (3)控制屬性(需要在雙括號...
    一曲廣陵散閱讀 6,473評論 0 4
  • WXML WXML(WeiXin Markup Language)是微信的一套標(biāo)簽語言旨别,結(jié)合基礎(chǔ)組件、事件系統(tǒng)汗茄,可...
    許劍鋒閱讀 6,779評論 3 51
  • What? 基于微信 類web 原生體驗 解決方案 How? 邏輯層(App Service) 邏輯層由JavaS...
    糖小工閱讀 1,782評論 0 7
  • 給提問的開發(fā)者的建議:提問之前先查詢 文檔秸弛、通過社區(qū)右上角搜索搜索已經(jīng)存在的問題。 寫一個簡明扼要的標(biāo)題洪碳,并且...
    極樂叔閱讀 13,394評論 0 3
  • 今天看到 剽悍一只貓這篇《太可怕了》瞳腌,啟發(fā)如下 首先從文章的角度講绞铃,標(biāo)題非常具有吸引力,引發(fā)好奇心嫂侍,很容易打開并一...
    真誠永恒閱讀 301評論 0 0