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>