vue——计算属性、侦听器的使用

computed

计算属性存在缓存，可以提高性能

<div id="app">{{fullName}}div>
<script>
var vm = new Vue({
	el:'#app',
	data:{
	firstName:'Tom',
	lastName:'cat'
	},
	computed:{
	fullName:function(){
		return this.firstName + " "+this.lastName;
		}	
}
})
script>

firstName和lastName的值发生变化，computed重新计算

watch

监听数据的变化

<div id="app">{{fullName}}div>
<script>
var vm = new Vue({
   el:'#app',
   data:{
   firstName:'Tom',
   lastName:'cat',
   fullName:' Tom cat'
   },
   watch:{
   //firstName发生改变时
   firstName:function(){
   	return this.firstName + " "+this.lastName;
   	},
   	//lastName发生改变时
   	lastName:function(){
   	return this.firstName + " "+this.lastName;
   	}	
}
})
script>

watch同样拥有缓存机制
watch相交于computed代码比较繁琐