异步请求数据成功后再初始化Echarts图表并绑定数据,我要怎么修改代码呢
时间: 2024-02-09 17:11:11 浏览: 18
你可以将初始化Echarts图表及绑定数据的代码放到异步请求数据成功的回调函数中去,例如:
```
mounted() {
this.getEchart()
},
methods: {
getEchart() {
getStatisics().then((res) => {
console.log(res);
this.cahrtList = res.result
console.log(this.cahrtList);
let myPie = echarts.init(document.getElementById('zhu'))
let option = {
// 省略部分代码
series: [
{
name: ['未完成', '进行中', '已完成'],
colorBy: 'data',
type: 'bar',
data: [this.cahrtList.unStartNum, this.cahrtList.doingNum, this.cahrtList.completeNum],
barWidth: 17,
},
],
};
myPie.setOption(option)
})
},
}
```
另外,你需要在data中将cahrtList初始化为一个对象,例如:
```
data() {
return {
cahrtList: {
unStartNum: 0,
doingNum: 0,
completeNum: 0
}
};
},
```
这样在后面的代码中,你就可以通过对象的属性来获取数据了。