vue3 chart-js 在悬停时显示以前的数据答案

【问题标题】：vue3 chart-js showing previous data on hovervue3 chart-js 在悬停时显示以前的数据
【发布时间】：2020-12-01 14:08:10
【问题描述】：

vue3 chart-js 在悬停时显示以前的数据。

我使用 API 数据更新了我提交的图表数据，但更新聊天数据后，图表在悬停时显示以前的 API 数据我也尝试过使用distory()

这是我的代码

 methods: {
    barChart() {
      var Chart = require("chart.js");
      let options = new Chart(document.getElementById("bar-chart-grouped"), {
        type: "bar",
        data: {
          labels: this.llabels,
          datasets: [
            {
              label: "पुरुष जनसंख्या",
              backgroundColor: "rgba(0, 143, 251, 0.8)",
              data: this.mdata,
            },
            {
              label: "महिला जनसंख्या",
              backgroundColor: "rgba(0, 227, 150, 0.8)",
             data: this.Fdata,
             },
            {
              label: "पअन्य जनसंख्या",
              backgroundColor: "rgb(254, 176, 25,0.8)",
              data: this.Odata,
            },
          ],
        },
      });
      if (!this.chart) {
        this.chart = options;
      } else {
        this.chart.options = options;
        this.chart.update();
      }
    },
}

【问题讨论】：

标签： javascript vue.js charts vuejs2 vuejs3

【解决方案1】：

用this.chart.options = options.options;代替this.chart.options = options;

变量选项保存您的图表，而不仅仅是选项。

更好的方法是仅在第一次运行该方法时创建图表（=> 将 new Chart 放在 if 内）

【讨论】：