Vue

by vinodlouis

HTML

<div id="app">
  <div v-for="item in a.b.items">
    <input type="checkbox" v-model="item.checked"> {{ item.name }} {{item.oh[0]}}
  </div>
  
  <button @click="fetch">Fetch more items</button>
</div>

Vue

new Vue({
  el: "#app",
  
  data: {
  a:{
  b:{
  items : []}
  }},
  
  methods: {
  	fetch() {
    	let itemsFromApiResponse = [
      	{ name: "Test 1" ,oh:[0,1]},
        { name: "Test 2", oh:[0,1] },
        { name: "Test 3", oh:[0,1] },
      ];
      
      itemsFromApiResponse.forEach(item => this.a.b.items.push(Object.assign({ checked: false }, item)));
    }
  }
})