vue引入Echarts的初始化及数据为空的处理

<template>
	<div id="marketChar" ref="marketChar" style="width: 100%; height: 260px;margin-top: 40px;" ></div>
</template>

import echarts from 'echarts'

 data() {
   return {
     eChart: null,
     list: [],
   }
 },
 methods:{
// 使用echart
    getMarketCharts() {
      const optionData = [];
      const legendData = [];
      this.list.forEach(element => {
        optionData.push({value: element.num, name: element.market});
        legendData.push(element.market);
      });
      if (this.eChart && this.eChart.dispose) {
        //移去上次渲染的结果
        this.eChart.dispose();
      }
      const eContainer = this.$refs.marketChar;
      if(this.list.length != 0){
        this.eChart = this.$echarts.init(eContainer);
        const option = {
          tooltip: {
            trigger: 'item',
            formatter: '{a} <br/>{b}: {c} ({d}%)'
          },
          legend: {
            data: legendData,
            type:'scroll',
            top: '0',
            orient:'horizontal'
          },
          series: [
            {
              name: '业务员',
              type: 'pie',
              radius: ['40%', '50%'],
              center: ['50%', '60%'],
              labelLine: {
                length: 25
              },
              label: {
                formatter: '{b|{b}} {c|{c}}',
                backgroundColor: '#FFFFFF',
                borderColor: '#FFFFFF',
                borderWidth: 0,
                borderRadius: 0,
                rich: {
                  b: {
                    color: '#4C5058',
                    fontSize: 10,
                    fontWeight: 'bold',
                    align: 'center',
                  },
                  c: {
                    fontSize: 10,
                    color: '#4C5058',
                  },
                }
              },
              data: optionData
            }
          ]
        };
        this.eChart.setOption(option,true);
        // 根据页面大小自动响应图表大小
        window.addEventListener("resize", function () {
          this.eChart.resize();
        });
      }else{
        //没有数据的时候
        this.initInnerHTML(eContainer);
      }
    },
    //echart 暂无数据
    initInnerHTML(eContainer) {
        eContainer.innerHTML = `
        <div class="van-empty" style="color: #969799;">
          <div class="van-empty__image"><img src="https://img.yzcdn.cn/vant/empty-image-default.png" ></div>
            <p class="tips" style="margin-top: 20px;">暂无数据,加油加油^-^</p>
        </div>
      `;
    }
   }