流程
created () {
this.initEchart()
},
methods: {
initEchart () {
axios.get('/echart').then((res) => {
let echartData = res.data;
this.$nextTick(() => {
let pieEchart = document.getElementById('pieChart');
let pieEcharts = Echarts.init(pieEchart);
let option = { }
pieEcharts.setOption(option)
// 如果需要点击圆环触发事件
pieEcharts.on('click', function(param) {
let typeName = param.name
switch (typeName) {
case '男':
location.href = `gender?sex=1`
break
case '女':
location.href = `gender?sex=2`
break
});
})
}).catch((error) => {
console.log(error);
})
}
},
循环
data() {
return {
pieArr: []
}
},
created () {
this.initEchart()
},
methods: {
initEchart () {
axios.get('/echart').then((res) => {
this.pieArr = res.data;
this.$nextTick(() => {
for (let i = 0, len = this.pieArr.length; i < len; i++) {
let pieEchart = document.getElementById('pieChart'+i);
let pieEcharts = Echarts.init(pieEchart);
let option = { }
pieEcharts.setOption(option)
}
})
}).catch((error) => {
console.log(error);
})
}
},
配置
以下配置以循环数据为例
一、标题 (title)
官方链接
标题如果无特殊要求ÿ
最低0.47元/天 解锁文章
1万+
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
