1.组件使用
组件的使用非常简单,从开发者文档中可直接复制到 wxml 文件中
例: wxml文件:
<button type="primary" > 登陆按钮 </button>
2.数据绑定,使用双花括号 {{}} ,在页面实例Page的 data中设置数据
data: {
text : "登陆按钮"
}
<button type="primary" > {{text}} </button>
3.点击事件
1>组件标签中添加 bindtap (绑定-点击)
<button type="primary" bindtap="btnClick"> {{btnText1}} </button>
2>在页面实例Page中 添加方法
btnClick :function () {
console.log("按钮被点击,打印日志")
this.setData{ text : "登陆按钮已被点击"}
}
4.渲染标签
1>判断是否显示,true为显示,false不显示
<view wx:if="{{bool}}"> 1 </view>
<view wx:else > 2 </view>
2>循环
wx:for="{{data}}" wx:for-itme="vo"(若不设置,默认为item)
<view wx:for="{{news}}" wx:for-item="a" wx:for-index="b">
{{a}} {{b}}
</view>
5.模版
方法1:
<include src="../templates/header" />
等同于复制模版文件中的代码,模版中直接使用页面中的变量
方法2:
设置模版:
<template name="footer1">模版1 - {{text}}</template>
模版引入:
<import src="../templates/footer />"
<template is="footer1" data="{{text : '给模版传的文本'}}"