首页 > 编程 > JavaScript > 正文

vue2.0 computed 计算list循环后累加值的实例

2019-11-19 14:13:12
字体:
来源:转载
供稿:网友

实例如下所示:

<template> <div class="hello">  <h1>{{ msg }}</h1>  <h2>Foo</h2>  <div v-for ="(item, index) in list">  <!--<p>{{item }}</p>-->  <h1 v-show="false">{{a[index] = item.bb}}</h1>   <!-- <h1>index:{{index}}</h1>-->  </div>  <h2>a:{{a}}</h2>  <h2>{{cc}}</h2>  <!--<button v-on:click="cc">点击</button>--> </div></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>

以上这篇vue2.0 computed 计算list循环后累加值的实例就是小编分享给大家的全部内容了,希望能给大家一个参考,也希望大家多多支持武林网。

发表评论 共有条评论
用户名: 密码:
验证码: 匿名发表