vue选项之watch用法

watch是一个对象，键是需要观察的表达式，值是对应的回调函数。可以观察某个数据，可以使单个数据，也可以是某个对象。

	<div class="app">
			<input type="text" v-model="msg.name">
			<input type="text" v-model="age">
		</div>
		<script type="text/javascript">
			new Vue({
			  el: '.app',
			  data: {
			  	age:"23",
			    msg:{
			    	"name":"你好",
			    	"age":"23"
			    }
			  },
			  watch:{
			  	age:(newValue,oldValue)=>{//age是代表我要监听的是data中的age选项，当发生变化的时候就会触发该方法
			  		console.log(newValue);//watch中的方法都有两个参数，新值和旧值
			  		console.log(oldValue)
			  	},
			  	msg:{
			  		handler:(newValue,oldValue)=>{
			  			console.log("新值是"+newValue.name,"旧值是"+oldValue.name)
			  			console.log('user被修改了')
			  		},
			  		deep:true//加了该选项以后，就能深度监听到对象的某个属性的改变。
			  	}
			  }
			})
		</script>

注意：在变异 (不是替换) 对象或数组时，旧值将与新值相同，因为它们的引用指向同一个对象/数组。Vue 不会保留变异之前值的副本。

注意在监听对象的时候，为了发现对象内部值的变化，可以在选项参数中指定 deep: true 。注意监听数组的变动不需要这么做。