[Chartjs]-Chart js not dispalying data array that comes from an axios request

by

1👍

✅

Turns out that when you try to update nested data, the component doesn’t re-render.
This is how I solved it, I put the entire object in an update function and call that function when i get my data from the back end, I hope this helps!:

 methods: {
  onInput(value) {
      this.filterData()
  },
  updateChart(data) {
    this.datasets = [{
          label: ["popularity"],
          backgroundColor:"#f93232",
          data: data
      }]
  },

  async loadData() {
    await this.$axios.get(this.url)
      .then(response => {
        this.updateChart(response.data)
      })
  },
},

mounted() {
   this.loadData()
 },

Leave a comment