vue2 echarts作为子组件，动态更新图表

项目中有一个需求就是既要显示表格table又要显示图表（eg:饼图，折线图，柱状图..etc.）由于表格有新增编辑功能，故 数据变化时，图表的数据也要变化，而echarts是子组件，数据是从从父组件传过来的，此时要通过watch深监听数据，即数组，一开始遇到的难点是在watch里报错，"unknown series undefined ",代码如下：

watch:{
    chartData:{
    handler(newVal){
    if(this.myChart){
    const option = {
    series:this.chartData
}
    this.myChart.setOption(option,true)
}
}
}
}

一直找不到原因。。。。

后来查找资料，说是this.chartData没有series数据，明明有啊，（不晓得为啥~~）后面又换了一种写法

watch:{
    chartData:{
    handler(newVal){
    if(this.myChart){
   this.init()
}
},
immediate: true, // 组件创建时立即执行一次  
deep: true // 深度监听对象内部属性的变化 
}
},
data(){
return{
    myChart:null
    }
},
mouted(){
    if(!this.myChart){
    this.myChart = echarts.init(this.$refs.chartContainer);//需要mounted时初始化一次，否则会报invalid dom
    this.init();
    }
},
methods:{
init(){
     const option = {
    series:this.chartData
    } //只写了关键部门，配置部门自行写~
    this.myChart.setOption(option,true)
}
}

以上代码是针对饼图的数据，当然，柱状图和折线图一样的道理~