Chart.jsでプルダウンと連動して表示を切り替える

グラフが再描画されない

プルダウンを選択すると、それに合わせてchart.jsで描画する内容を変えたかった。
・・・が、変わらない。

$setを使ってみる

this.$set(chartData, 'data', response)

としてみたけど、これでも変わらない。

Chart.js側の設定が必要だった

reactivePropを追加してあげればOKだった。

import { Line, mixins } from 'vue-chartjs'    ☆★ mixinsを追加！ ☆★
const { reactiveProp } = mixins               ☆★ これを追加！ ☆★

export default {
  extends: Line,
  mixins: [reactiveProp],                     ☆★ これを追加！ ☆★
  props: {
    chartData: { type: Object, default: null },
    options: { type: Object, default: null }
  },

  mounted () {
    this.renderChart(this.chartData, this.options)
  }
}

Chart.js#Updating Charts