vue动态生成多个Echarts图表

1.动态循环id

<div v-for="(item,index) in chartList" :key="index">
      <div :id="`chart${index}`"></div>
</div>

 

2.js部分

?

1 2 3 4 5 6

this.chartList = res.data.data.chartList;//从后台获取数据 if (this.chartList.length > 0) {   this.$nextTick(() => {     this.initChart()   }) }

　　

 

?

1 2 3 4 5 6 7 8

initChart() {     this.chartList.forEach((val, index) => {       const myChart = this.$echarts.init( document.getElementById(`chart${index}`))       //注意this.chartList[index]这是我们后台拼好数据直接set就行了       myChart.setOption(this.chartList[index])     })   } },