监听器的我们一般是采用watch作为方法进行使用。
watch监听器的作用是为了满足开发者对数据能够时时获取其变化，从而对数据的变化进行操作
那么我们来看一下其语法格式（注意一下watch的位置是和el，data，methods同级的）
1.方法格式的监听器
data:{ username:' ' }, //监听useranme的事件变化 //newVal是新值，oldVal是旧值 watch:{ //侦听器本质上是一个函数 username(newVal,oldVal){ //新值在前，旧值在后 console.log(newVal,oldVal); } } 从这段代码我们可以看到我们监听的是username值得时时变换，能够获得时时更新得新值和旧值
在监听器中有两种监听方式，一种是方法格式得监听器（如上图），一种是对象格式得监听器。
2.对象格式的监听器
data:{
username:' '
},
watch:{
//调用对象格式的监听器
username:{
//侦听器的处理函数
handler(newVal,oldVal){
console.log(newVal,oldVal);
},
//表示一进入界面就立即触发一次监听事件，false是默认值
immediate:true
}
}
其中的handler你可以看作是一个函数，作为桥梁来勾连数据的，
immediate是能够保证在刚进入界面的时候便开始进行监听，如果没有添加这个事项的话是无法在刚进入页面的时候就触发监听事件。（备注：第一种方法是没有这个方法的哦）
很明显两种方法都可以进行数据的监听，那么我们一般使用那种监听方式呢？
我来例举一下两种方法的优缺点
方法格式的监听器：
缺点：1.无法在刚进入页面的时候进行触发，缺少灵活性
2.如果我们需要监听的是一个对象，那么如果属性中的值发生变化的时候也无法监听到数据的变换
对象格式的监听器：
优点：1.可以通过immediate的方法在刚进入页面的时候就可以触发监听
2.还有一个deep的方法，进行深度监听（这个方法我们在下面会讲到）
所以很明显在以后的开发上我们一般会采用第二种方法来进行数据的监听
那么接下来讲一下对象格式监听函数的deep方法
deep方法是能够监听到其对象的属性其数据的变化
格式如下：
info:{
//开启这种监听方式的时候是不会监听到数据，我们可以深度监听就可以获取到数据
handler(newVal){
console.log(newVal);
},
//只要对象中任何一个属性发生变化我们都可以监听到其数据的变化
deep:true
}
这么一看似乎代码的样子颇有些繁琐，那么我们来进行简化一下，我们需要监听的是其对象属性数据的变化，那么我们可以直接对其进行访问，并且应该用一个单引号进行包裹住。
格式如下：
watch:{
'info.username'(newVal){
console.log(newVal);
}
是不是觉得代码简洁了不少！
这就是以上监听器的一些基本知识。
