Vue.js学习笔记（七）--------监听属性

监听属性

watch的用法：

  vue可以通过watch来监听属性值的变化。

效果图：

代码：

<div id="div1">
		人民币：<input type="number" v-model.number="rmb"><br>
		汇率：<input type="number" v-model.number="huilv"><br>
		换算后：<input type="number" v-model.number="huansuan">
	</div>
	
	<script>
		new Vue({
			el:"#div1",
			data:{
				rmb:0,
				huilv:6.6,
				huansuan:0,
			},
			watch:{
				rmb:function(){
//					this.rmb=val;
					this.huansuan=this.rmb/this.huilv;
				},
				huansuan:function(){
					this.rmb=this.huansuan*this.huilv;
				},
				huilv:function(){
					this.huansuan=this.rmb/this.huilv;
					this.rmb=this.huansuan*this.huilv;
				}
			}
		})
	</script>