前言:对于后端的小伙伴来说，现在用vue-element-admin 真的太香了，毕竟Java向的程序员，光后端技术栈就得学到头皮发麻啊，所以，感谢尤雨溪，感谢饿了么，感谢花裤衩。
最近在帮朋友写东西的时候，用到了饼图，可是数据明明已经加载到了，并且格式是对的，但是为啥就没法渲染呢？
出现类似的问题，我们的思路往往是如下排除:
1.代码本身是否有问题。
2.数据格式对吗。
3.代码加载顺序。
所以，这就要求我们对前端，或者直接说js弱类型(当然es6和ts是比较严格了)比较适应，同时对Vue基础比较扎实，然后就是对Vue生命周期钩子熟悉了。
遇到了这个问题，一则可以使用watch，监听数据变化。
watch: {
echarts_option: {
handle(newVal,oldVal) {
if(this.chart){
if(newVal){
this.chart.setOption(newVal);
}else{
this.chart.setOption(oldVal);
}
}
}
}
}这里的this.chart是放在data里边的，你的chart的实例
第二个是，直接将重新绘制的函数，写在后端请求的then里边
getData() {
summaryAPI.getTerminalList().then(data => {
console.log(data.data);
let dataArray = [];
dataArray = data.data;
console.log(dataArray);
for(let i = 0;i<dataArray.length;i++){
this.legendData.push(dataArray[i].type);
let singleData = {value: dataArray[i].count,name: dataArray[i].type}
this.seriesData.push(singleData);
}
console.log('data->'+this.legendData+'-'+this.seriesData)
this.$nextTick(() => {
this.initChart()
})
}).catch();
}
