微信小程序学习3:小程序语法-数据绑定
可以认为是声明变量,只不过小程序的变量要在规定位置声明。
官方文档https://developers.weixin.qq.com/miniprogram/dev/reference/wxml/data.html
在页面的.js
的data对象
声明,变量一般要有初始化。
小程序要使用的动态数据都会找data对象
要。
例子
- 页面
.js
的 data 对象中创建msg
数据对象
data: {
msg: '初始化测试'
},
在*.wxml文件
(类似网页的html)使用数据
1.模板结构中使用双大括号 {{message}}
2.注意事项: 小程序中为单项数据流 model —> view
<text class="userName">{{msg}}</text>
<view>{{msg}}</view>
在*.js
修改数据
-
语法:this.setData({message: ‘修改之后的数据’}, callback),callback可以省略
-
特点:
a) 同步修改: this.data 值被同步修改
b) 异步更新: 异步将 setData 函数用于将数据从逻辑层发送到视图层(异步)
教程例子,新建一个 changeText 函数修改,在哪里修改都会同步
data: {
msg: '初始化测试', // 多个数据以英文逗号
},
changeText: function(){
this.setData({ // 修改数据2
msg: '修改数据2'
})
},
onLoad: function (options) {
console.log('OnLoad()');
console.log(this);
this.setData({ // 修改数据1
msg:'修改之后的数据'
});
this.changeText(); //函数调用,分号,
},