Vue

by Ruslan Mahin

HTML

<div id="app">
  <h2>Cars:</h2>
  <ul v-for="(item, index) in todos">
    <li>
      <input type="text" v-model.number="item.value">
    </li>
  </ul>
  <button @click="add">
   add
  </button>
  
  <div>
    Count: {{ total }}
  </div>
</div>

Vue

new Vue({
  el: "#app",
  data: {
    todos: [
      { value: 10, img: '' },
      { value: 20, img: '' }
    ]
  },
  methods: {
  	add: function () {
    	this.todos.push( {value : 0} );
    }
  },
  computed: {
  	total: function () {
    	let result = 0;
    	this.todos.forEach(function (item) {
      	result += item.value;
      });
      return result;
    }
  }
})