Vue+Echarts实现遍历datalist批量输出多个折线图总结

Vue+Echarts实现遍历datalist批量输出多个折线图总结

1. 为多个chart采用v-for循环设置div

<el-row class="rowChart" v-for="(item, index) in datalist" :key="index" >
        <div class="danchart" :id="'chart' + index"> </div>
</el-row>

2. 创建datalist

export default {
    data() {
        return {
            datalist: [],
        };

3. 写methods

 charts() {
            getChartData().then(results => {
                this.datalist = results.data;
                this.$nextTick(() => {  // this.$nextTick和.map谁在前谁在后都行
                this.datalist.map((item, index) => {