除了上篇讲过的两种数据绑定方法：
- 直接修改text内容
- 在js文件中添加text指定内容
本篇将进一步学习如何控制数据绑定及其动态变化。
·
查看数据动态变化
1. 以按钮为例，为其绑定数据，查看事件变化。
//wxml文件
<button type="default" bindtap="butonclik"> default </button>
//js文件附加代码（除本身代码外）
butonclik : function(){
console.log("内容已点击")
}
效果图：
点击两次按钮：
2. 以按钮为例，为其绑定数据，查看内容变化
//wxml文件
<button type="default" bindtap="butonclik"> default </button>
<text>{{text}}</text>
//js文件
// pages/first/first_demo.js
Page({
/**
* 页面的初始数据
*/
data: {
text : "旧的内容"
},
/**
* 生命周期函数--监听页面加载
*/
onLoad: function (options) {
},
/**
* 生命周期函数--监听页面初次渲染完成
*/
onReady: function () {
},
/**
* 生命周期函数--监听页面显示
*/
onShow: function () {
},
/**
* 生命周期函数--监听页面隐藏
*/
onHide: function () {
},
/**
* 生命周期函数--监听页面卸载
*/
onUnload: function () {
},
/**
* 页面相关事件处理函数--监听用户下拉动作
*/
onPullDownRefresh: function () {
},
/**
* 页面上拉触底事件的处理函数
*/
onReachBottom: function () {
},
/**
* 用户点击右上角分享
*/
onShareAppMessage: function () {
},
butonclik : function(){
console.log("内容已点击")
this.setData({text:"新的内容"})
}
})
效果图：
按下按钮：
其他注意事项
1. 第一个界面取决于外部文件json的pages配置顺序，如下图：
