我有一个包含两个图表的组件，在单击按钮时显示。我使用同一个图表组件，但通过两个不同的getter为它给予不同的chartData。图表如下所示：

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

export default {
extends: Bar,
mixins: [mixins.reactiveProp],
props: ['chartData', 'options'],
mounted() {
   this.renderChart(this.chartData, this.options);
  },
};
</script>

我知道如果数据发生更改，reactiveProp将呈现新图表（并初始化了漂亮的动画）。但是目前有两个getter为this.chartData给予了相同的数据，所以当我试图切换图表时，它保持不变。有没有什么方法可以更新或销毁数据，以便重新呈现图表，即使它从另一个getter获得了相同的数据？出于某些原因，像update这样的方法（）、destroy（）、clear（）都不管用，但可能我用错了地方。
下面是我的页面与图表：

<template>
 <div>
  <button @click="showAll = false">
          Show old users
  </button>
  <button @click="showAll = true">
          Show all users
  </button>
  <chart v-if="isChartData === true && showAll === false" :options="options" :chart-data="setDataOld" />
  <chart v-if="isChartData === true && showAll === true" :options="options" :chart-data="setData" />
 <div>
<template>