1、计算属性
对于较复杂的逻辑可以使用计算属性
<div id=‘box‘>
<p>
<label for="name">名字</label>
<input type="text" id="name" v-model="name">
</p>
<p>
<label for="age">年龄</label>
<input type="text" id="age" v-model="age">
</p>
<p>{{intro}}</p>
</div>
var vm = new Vue({
el:"#box",
data:{
age:‘‘,
name:‘‘
},
computed:{
intro:function(){
if(this.age && this.name)
return ‘你的名字是‘+this.name+‘,今年是‘+this.age+‘岁～‘
}
}
});
计算属性intro，依赖着age和name，当两个中的任何一个值发生改变，都会导致intro中文字变化。
计算属性 VS 方法
使用方法也能实现，只是计算属性是基于它的依赖进行缓存的。只有它的相关依赖发生改变时才会重新求值。
计算属性 VS watch属性
vue提供一种更通用的方式来观察和响应vue实例上的数据变动 ， watch选项，来相应数据的变化。主要用于在数据变化响应时，执行异步操作或开销较大的操作
原文：http://www.cnblogs.com/tiantianxiangshang33/p/6879655.html