1.计算属性的基本使用
![vue-computed之计算属性 vue-computed之计算属性](/default/index/img?u=aHR0cHM6Ly9waWFuc2hlbi5jb20vaW1hZ2VzLzM5MS9kZjZiZGYxYTM3Y2JjY2QxNTA4ODNjMGVhY2Y3YWRjNy5wbmc=)
计算出来的结果就是 ”Lebron James“,其实计算属性计算出来的结果和methods没有多大区别。
2.计算属性的复杂操作
![vue-computed之计算属性 vue-computed之计算属性](/default/index/img?u=aHR0cHM6Ly9waWFuc2hlbi5jb20vaW1hZ2VzLzg1OS9lMmU4OWRjOThhZDhhNTYwN2UwOTRjODE3MWFkNDQ2My5wbmc=)
其实就是在计算属性里面进行循环将结果都算出来,然后再将结果返回就可以了。是比较方便的。
3.computed的区别
![vue-computed之计算属性 vue-computed之计算属性](/default/index/img?u=aHR0cHM6Ly9waWFuc2hlbi5jb20vaW1hZ2VzLzIwNS81ZjRlMGEwZjE2OGFkOGU3M2NmNjE1NDhlNzY4YTc2ZC5wbmc=)
![vue-computed之计算属性 vue-computed之计算属性](/default/index/img?u=aHR0cHM6Ly9waWFuc2hlbi5jb20vaW1hZ2VzLzEyOS9lMGFiZTc0NjljYTM3MjgzZjQ3YjYwMjMzYjNlNGFhMS5wbmc=)
从结果中我们可以看到,虽然都输出了,但是在进行重复打印时,methods会输出多次,而computed属性只会输出一次,,从而我们可以知道只有当值发生改变的时候computed才会重新调用,而这会大大的减少内存,使用起来会更方便。