学习微信小程序WXML之数据绑定
文档：数据绑定 · 小程序
此贴为学习9 小时搞定微信小程序开发 的笔记
数据绑定使用两个花括号。
- 绑定文本内容
<view>
<text>{{message}}text>
view>//index.js
Page({
data:{
message:"Hello,world"
}
})
2. 绑定属性
<view>
<text data-name="{{theName}}">
text>
view>data-name为自定义属性，当组件上触发的事件时，会把data-*属性发送给事件处理函数。所以可以把页面上的数据通过data属性传给逻辑层。
//index.js
Page({
data: {
theName:"Jack"
}
})
3.运算符绑定
<view hidden="{{flag ? true : false}}">
Hidden
view>view标签的hidden属性可以设置显示或隐藏view标签的内容。
//index.js
Page({
data:{
flag: false
}
})传入flag变量为false，hidden属性为false，显示标签内容；如果flag变量为true，则显示view标签内容。
还有其他绑定方式，请看小程序框架文档：数据绑定 · 小程序
标签属性
所有组件都有的共同属性：
详见：组件 · 小程序
bind、catch可以绑定组件的事件，通过绑定事件的回调函数来进行一些操作。详见：事件 · 小程序