vue属性监视--- highlight: tomorrow-night --- ```html 第一个数：第二个数：

<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title></title>
	</head>
	<body>
		<!-- 
		 1. 监视属性:
		 	通过通过vm对象的$watch()或watch配置来监视指定的属性
		 	当属性变化时, 回调函数自动调用, 在函数内部进行计算
		 -->
			<div id="d1">
				第一个数：<input type="number" v-model="one" /><br>
				第二个数：<input type="number" v-model="two" /><br>
				积：<input type="text" v-model="js" /><br>
			</div>
			<script type="application/javascript" src="../js/vue.js"></script>
			<script type="application/javascript">
				var vm = new Vue({
					el : "#d1",
					data : {
						one : 10,
						two : 5,
						js : 50
					},
					/* 监视:watch属性的写法 */
					/* watch : {
						 监视名为one的model 
						one : function(){
							this.js = this.one * this.two;
						},
						two : function(){
							this.js = this.one * this.two;
						}
					} */
				});
				/* 监视:vue实例的watch()方法
					vv形参会获取到名为one的model改变后的值*/
				vm.$watch("one", function(abc){
					console.log("值为："+abc);
					this.js = abc * this.two;
				});
			</script>
	</body>
</html>