vBarChart is not being updated (with data from prop)

[baermathias]

When updating the data via a prop the chart is not being re-rendered. console.log verifies that this.level and this.chartData.data[0] are getting new values, but the chart is still the same.

Some example code would look like this:

<template>
  <div>
    <v-chart v-bind:chartData="chartData"></v-chart>
  </div>
</template>

<script>
export default {
  name: 'example',
  props: {level: Number},
  data () {
    return {
      chartData: {
        chartType: 'vBarChart',
        selector: 'chart',
        width: 200,
        height: 300,
        data: [100]
      },
    }
  },

  watch: {
    level: function () {
      this.chartData.data[0] = this.level
      //debug
      console.log(this.level)
      console.log(this.chartData.data[0])
    }
  },
}
</script>