一：数据绑定以及跳转传参
首先，我们先创建一个新的项目。可以看到创建的新的小程序有一个默认的HelloWorld的Demo.如下图
这里先介绍一下微信小程序的数据绑定
微信小程序的基于MINA框架开发的。每一个页面由 .js（必须） .wxml（必须） .wxss(非必需) .json(非必须) 这四个文件组成，且命名必须相同。
我们打开pages文件夹下面的index.js.修改
Page({
data: {
motto: '第一页的Hello World',//这里做了修改
userInfo: {}
}
将motto对应的值做了一下简单的修改，编译，可以看到主页的HellowWorld也已经做了相应的变化。在看看 .wxml文件
<text class="user-motto">{{motto}}</text>
可以看到有这么一段代码，而中间的{{motto}} 也刚好对应了.js里面的motto。没错，这就是微信小程序的数据绑定。 通过{{ 对应.js中的对应的data}}来进行绑定。
接下来，我们要将这个我们修改过的motto设置成点击事件，跳转到另一个页面并且将参数传递过去。
先添加点击事件 gotologs
<view class="usermotto">
<text class="user-motto" bindtap="gotologs">{{motto}}</text>
</view>
在.js里面添加方法。
gotologs() {
wx.navigateTo({
url: '../logs/logs?motto='+this.data.motto
})
}
由于使用的是ES6语法，你需要在项目里面勾上 ES5转ES6
接下来修改logs.wxml来显示我们要传过去的参数。
<view class="usermotto">
<text class="user-motto">{{twomotto}}</text>
</view>
当然，你需要先在logs.js里面对穿过来的参数进行处理。
Page({
data: {
},
onLoad: function (options) {
this.setData({
twomotto: options.motto
})
}
})
二：事件机制
在微信小程序中，可以看到同为点击事件，有的是bindtap而有的是catchtap，那么这两者有什么区别呢？为了进一步了解微信小程序的事件机制，在原DEMO的基础上增加了一个简单的页面。效果如下。
红黄绿分别代表三个view。 红是最外层的， 黄绿依次为中底层。 每一层view对应着一个点击事件。（outtap,midtap,innertap）。
Page({
outtap(event){
console.log("out:"+event);
},
midtap(event){
console.log("mid:"+event)
},
innertap(event){
console.log("innertap:"+event)
}
})
首先先把所有的事件都改为bindtap。分别点击inner层，middle层，out层。再看看日志上打印出来的数据。
<view id="out" class="out" bindtap="outtap">
out
<view id="middle" class="middle" catchtap="midtap">
middle
<view id="inner" class="inner" bindtap="innertap">
inner
</view>
</view>
</view>
可以看到，当为view的点击时间为bindtap的时候， 点击最底层的innerview的时候，除了触发innertap的点击方法之外，事件还会往上进行传递，依次触发midtap和outtap方法。
然后我们把middle的bindtap改成catchtap,再分别点击三个视图层。（顺序 inner middle out）
可以看到，当mid层使用了catchtap后，事件执行到mid层之后，便不会再往上进行传递。
从上面的截出来的图片中， 我们可以看到点击了控件之后，返回的是一个Object对象，那么这个对象里面包含什么信息呢。查看官方文档。
其中type为事件类型，timeStamp为事件生成的时间戳，target为触发事件的组件的一些属性值集合，currentTarget当前组件的一些属性值集合，touches为触摸事件，包含的信息为触摸点信息的数组，detail为额外的信息集合。
以下为事件的一些详细信息。
从官方的文档中，我们可以发现，事件分为两种，一种是冒泡事件，另一种是非冒泡事件。
a.冒泡事件：当一个组件上的事件被触发后，该事件会向父节点传递
b.非冒泡事件:当一个组件上的事件被出发后，该事件不会向父节点传递。
显然bindtap属于冒泡事件，catchtap属于非冒泡事件。
除了bindtap之外，wxml的其他冒泡事件还有以下事件。
注：除上表之外的其他组件自定义事件都是非冒泡事件，如<form/>的submit事件，<input/>的input事件，<scroll-view/>的scroll事件。
