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>