-类型: { [key: string]: Function | { get: Function, set: Function } }
详细:
计算属性将被混入到 Vue 实例中。所有 getter 和 setter 的 this 上下文自动地绑定为 Vue 实例。
注意，不应该使用箭头函数来定义计算属性函数 (例如 aDouble: () => this.a * 2)。理由是箭头函数绑定了父级作用域的上下文，所以 this 将不会按照期望指向 Vue 实例，this.a 将是 undefined。
计算属性的结果会被缓存，除非依赖的响应式属性变化才会重新计算。 (以上为官网解释)
然后通过今天的项目实例 联系一下computed的实时计算
1.计算目的如图 图中的前五个是一组json数据，添加新地址是另外加入的标签，所以之后提到的数字等描述均不包括此标签
2.图中的list一共为6个（不算‘添加新地址’），首先，我想先将list变为三个，剩下的隐藏，这是我们可以使用computed方法 html代码
<!--引用computed中的函数--> <li v-for="(item,index) in filterAddressList"> <!--此处调用的json数据--> <dl> <dt>{{item.userName}}</dt> <dd class="address">{{item.streetName}}</dd> <dd class="tel">{{item.tel}}</dd> </dl> </li>js代码
computed:{ filterAddressList:function () { //返回数值--用slice方法姜将list变为三个 return this.addressList.slice(0,3); } },效果如图
3.然后我们通过点击more链接，实现将隐藏的list显示出来 js
data:{ limitNum:3, addressList:[] }, computed:{ filterAddressList:function () { return this.addressList.slice(0,this.limitNum); } }, methods:{ loadMore:function () { var _this=this; if(this.limitNum==3){ _this.limitNum=_this.addressList.length; } } }我们通过limitNum的动态变化，就实现对list的切换
