vue计算属性computed:{}
相对于methods定义的方法,computed定义的方法一般看成属性值进行使用
计算属性会进行缓存,如果多次使用时只调用一次。而methods里的方法使用一次就要调用一次。
例子:
<div>
<p>总价是:{{totalprice}}</p>
</div>
<script src="./js/vue.js"></script>
<script>
let vue =new Vue({
el:'#app',
data:{
books:[
{id:1,name:'钢铁',price:46},
{id:2,name:'海底',price:39},
{id:3,name:'汤姆',price:56}
] },
computed:{
totalprice:function(){
let result=0
for(let i=0;i<this.books.length;i++)
{ result+=this.books[i].price } return result } }
})
</script>
计算书籍总价:141