一次Vue中computed沒有觸發的原因排查經歷

  vue中computed計算屬性可以用來綁定動態變量，而且它可以實時刷新，並且也可以在watch中監控，所以本人很喜歡用這個東西，一般把需要隨data中變量一起變化的屬性全部放在這裏面，data中只定義互相獨立互相不影響的變量，這樣可以極大地減少重複變量的定義，使代碼結構清晰，也便於排查錯誤。

  然後最近出現了一個問題，就是我在computed中定義的一個動態變量沒有在相關屬性發生變化後觸發更新。代碼如下：

data(){
	return {
		model:{
			name:"test"
		}
	}
}

computed:{
	lonexist:function(){
		return this.model.lon!=null;
	}
}

method:{
	changelon(){
		this.model.lon="123";
	}
}

  以上只是簡化代碼，目的是說明問題，然後我在一個button的click事件中綁定changelon方法，點擊button後lonexist計算屬性並沒有被觸發。

  原因是model初始化時沒有這個屬性，解決方法是在model的初始化方法中添加這個屬性就可以了:

data(){
	return {
		model:{
			name:"test"，
			lon:null
		}
	}
}