Vue-Chartjs onComplete自定义标签-防止闪烁

<template>
  <div>
    <vue-chartjs :chart-data="data" :options="options" :onComplete="onChartComplete"></vue-chartjs>
  </div>
</template>

<script>
import { Bar } from 'vue-chartjs';

export default {
  extends: Bar,
  data() {
    return {
      data: {
        labels: ['January', 'February', 'March', 'April', 'May', 'June', 'July'],
        datasets: [
          {
            label: 'Data',
            backgroundColor: '#f87979',
            data: [40, 20, 30, 50, 60, 70, 80]
          }
        ]
      },
      options: {
        responsive: true,
        maintainAspectRatio: false
      }
    };
  },
  methods: {
    onChartComplete() {
      // 在图表渲染完成后执行的逻辑
      // 可以在这里进行数据更新等操作，避免闪烁
    }
  },
  mounted() {
    this.renderChart(this.data, this.options);
  }
};
</script>