[Vuejs]-Vue.js – Values created in a method (on-click) not being displayed in a v-for loop

by

2👍

✅

In documentation of vuejs it is clearly mentioned that v-for is for arrays and not objects.

https://v2.vuejs.org/v2/guide/list.html

Your properties is an object which has name as size.

Make this change

new Vue({
  el: '#app',
  data () {
    return {
      properties: []
    }
  },
  methods: {
    fetchData () {
      var nameObj = {'title': 'name'}
      var sizeObj = {'title': 'size'}
      
      nameObj['value'] = 'file.txt'
      sizeObj['value'] = 12
      
      this.properties.push(nameObj)
      this.properties.push(sizeObj)
      
      console.log(this.properties)
    }
  }
})

After this change your code will work fine

👤Prajval M

Leave a comment