This time I will bring you vue2.0 computed to calculate the cumulative value of the list loop. What are the precautions for vue2.0 computed to calculate the cumulative value of the list loop. The following is a practical case. Let’s take a look. one time.
The example is as follows:
<template> <p class="hello"> <h1>{{ msg }}</h1> <h2>Foo</h2> <p v-for ="(item, index) in list"> <!--<p>{{item }}</p>--> <h1 v-show="false">{{a[index] = item.bb}}</h1> <!-- <h1>index:{{index}}</h1>--> </p> <h2>a:{{a}}</h2> <h2>{{cc}}</h2> <!--<button v-on:click="cc">点击</button>--> </p> </template> <script> export default { name: 'foo', data () { return { msg: '这儿是Foo', list:[{ insertId: 'asfasf252', bb:29 },{ insertId: '2652', bb:20 },{ insertId: '996', bb:18 }], a:[] } }, computed:{ cc: function(){ var sum = 0; for(var i= 0 ;i< this.a.length; i++) { sum += parseInt(this.a[i]); } return sum; } } } </script> <!-- Add "scoped" attribute to limit CSS to this component only --> <style scoped> h1, h2 { font-weight: normal; } ul { list-style-type: none; padding: 0; } li { display: inline-block; margin: 0 10px; } a { color: #42b983; } </style>
How to modify the value in vue request data
How to assign $set to an array in vue.js renew
The above is the detailed content of vue2.0's computed calculates the cumulative value of the list loop. For more information, please follow other related articles on the PHP Chinese website!