1.組件使用
組件的使用非常簡單,從開發(fā)者文檔中可直接復(fù)制到 wxml 文件中
例: wxml文件:
<button type="primary" > 登陸按鈕 </button>
2.數(shù)據(jù)綁定厚脉,使用雙花括號 {{}} ,在頁面實(shí)例Page的 data中設(shè)置數(shù)據(jù)
data: {
text : "登陸按鈕"
}
<button type="primary" > {{text}} </button>
3.點(diǎn)擊事件
1>組件標(biāo)簽中添加 bindtap (綁定-點(diǎn)擊)
<button type="primary" bindtap="btnClick"> {{btnText1}} </button>
2>在頁面實(shí)例Page中 添加方法
btnClick :function () {
console.log("按鈕被點(diǎn)擊胶惰,打印日志")
this.setData{ text : "登陸按鈕已被點(diǎn)擊"}
}
4.渲染標(biāo)簽
1>判斷是否顯示傻工,true為顯示,false不顯示
<view wx:if="{{bool}}"> 1 </view>
<view wx:else > 2 </view>
2>循環(huán)
wx:for="{{data}}" wx:for-itme="vo"(若不設(shè)置,默認(rèn)為item)
<view wx:for="{{news}}" wx:for-item="a" wx:for-index="b">
{{a}} {孵滞}
</view>
5.模版
方法1:
<include src="../templates/header" />
等同于復(fù)制模版文件中的代碼,模版中直接使用頁面中的變量
方法2:
設(shè)置模版:
<template name="footer1">模版1 - {{text}}</template>
模版引入:
<import src="../templates/footer />"
<template is="footer1" data="{{text : '給模版?zhèn)鞯奈谋?}}"