微信小程序学习--数据交互与事件绑定

1、视图层与逻辑层

小程序中的视图层和逻辑层的交互是通过数据绑定和事件响应实现的，这是一种单向绑定的机制。首先将逻辑层和视图层的数据和事件进行绑定，当需要修改页面时，逻辑层只需要调用特定的setData方法修改已绑定的数据，这时框架会自动触发WXML重新渲染，达到逻辑层对视图层的控制；
当框架接收到用户交互操作时，会根据视图层绑定的事件，执行逻辑层中对应的事件函数，达到逻辑层对视图层的响应，视图层与逻辑层的关系如图2-1所示。

2、一个简单的例子

（1）新建一个微信小程序项目，直接在hello world程序更改，以下是我的目录结构：

（2）在index.js中增加数据

data:{ count:0}

（3）在index.js中增加函数

countClick() {  
      this.setData({          
          count : this.data.count + 1    
     }) 
  }

（4）在index.wxml中，将头像的点击函数改为countClick（）；

（5）在index.wxml中添加显示

（6）结果
我的源码：链接