Chartjs-Reload chart on api call

Neither familiar with the library or vue.js in general, but the documentation says the following about updating the chart…

Chart.js does not provide a live update if you change the datasets.
However, vue-chartjs provides two mixins to achieve this.

reactiveProp reactiveData Both mixins do actually achieve the same.
Most of the time you will use reactiveProp. It extends the logic of
your chart component and automatically creates a prop named chartData
and adds a vue watch on this prop. On data change, it will either call
update() if only the data inside the datasets has changed or
renderChart() if new datasets were added.

You’re not using the mentioned props in the documentation. You can read more it on the official documentation

If you are using vue-chartjs, the library has its own way to handle reactive data in charts:

// ChartBar.js
import { Bar, mixins } from 'vue-chartjs'
const { reactiveProp } = mixins

export default {
  extends: Bar,
  mixins: [reactiveProp],
  props: ['options'], // passed from the parent
  mounted () {
    // this.chartData is created in the mixin (pass it as any prop with :chart-data="data").
    this.renderChart(this.chartData, this.options)
  }
}

Now use the component

<chart
  :chart-data="chartdata"
  :options="options"
/>

You can read more about it here: https://vue-chartjs.org/guide/#updating-charts,
there are some caveats