2.4 JS文件--小程序的逻辑
2.4.5 将数据显示在视图
Page注册中的data属性是一个Object变量,以下代码可以将data属性中的text变量显示在页面中。 ，
<text>{{text}}<text>
希望在某个情况下修改text中文字的内容，需在Page注册的函数中执行this.setData函数，更新data属性中的数据，同时显示在页面。
Page（{
/**
* 页面上拉触底事件的处理函数
* 页面滚动到底，将text的值修改
*/
onReachBottom() {
this.setData({
text: 'Page data is updated'
})
}
}）
不能通过赋值的方式直接修改data中的text，因为无法触发页面渲染的逻辑，也无法将更新的数据同步显示到页面上。
2.4.6 页面组件事件处理
为了实现交互，在页面注册需加入组件事件处理函数，即自定义函数
Page({
handleTabItem(event){ //定义一个事件处理函数，传入一个参数event
console.log('The item is tapped.') //在调试器Console中打印一些信息
console.log(event.target.dataset.hi) //在调试器Console中打印从视图层传递过来的数据
}
})
接下来在页面wxml，将函数绑定在组件上，在单击组件时触发该函数，代码如下：
<view bindTape="handleTabItem" data-hi="WeChat">页面按钮</view>
(实际开发，单击并没有触发handleTabItem，不知道有没有读者答疑，或者后续学习多了经验我能回答自己之前的疑问。)
网友评论