new Vue({ el:'#app', data(){ return { servicios_usuario:[], servicios:[ {servicio:'A', costo:1200}, {servicio:'B', costo:800}, {servicio:'C', costo:1500}, {servicio:'D', costo:900}, {servicio:'E', costo:500}, ] } }, computed:{ total(){ let this_ = this, total = 0; for(i=0;i<this_.servicios_usuario.length;i++){ console.log(this_.servicios_usuario[i]) total += this_.servicios_usuario[i]; } return total; } } })
<div id="app"> <h1>Servicios</h1> <label v-for="item in servicios"> <input type="checkbox" :value="item.costo" v-model="servicios_usuario"> {{ item.servicio }} </label> <pre>{{ servicios_usuario }}</pre> <strong>Total: {{ total }}</strong> </div>