VUE中解决echarts数据二次渲染不成功的问题xAxis

应该设置：mychart.setOption({},true);

原因：chart.setOption(option,notMerge,lazyUpdate);

option:图表的配置项和数据

notMerge:可选，是否不跟之前设置的option进行合并，默认为false，即合并。（这里是导致二次渲染不成功的根本）

lazyUpdate:可选，在设置完option后是否不立即更新图表，默认为false，即立即更新。

methods：  

// 商品
    getGoods () {
      this.goodsName = this.goodsName
      this.charts = echarts.init(document.getElementById("goods"));
      var emphasisStyle = {
        itemStyle: {
          shadowBlur: 10,
          shadowColor: 'rgba(0,0,0,0.3)'
        }
      };
      this.charts.setOption({
        legend: {
          icon: "circle",
          left: '88%',
          top: '0%',
          align: 'left',  //文字位置
          data: ['增幅', '数量'],
          itemWidth: 8,  // 设置宽度
          itemHeight: 8, // 设置高度  
          bottom: 10,
          left: 'center',
        },
        tooltip: {
          trigger: 'item', //axis   单个柱形图
          axisPointer: { // 坐标轴指示器，坐标轴触发有效
            type: 'shadow'// 默认为直线，可选为：'line' | 'shadow'
          },
          formatter: (params) => {
            var per = params.seriesName == '增幅' ? '%' : ''
            return params.name + '<br/>' + params.seriesName + ' : ' + params.value + per;
          }
        },
        toolbox: {},
        xAxis: {
          data: this.xAxisData, //x轴
          name: '',
          axisLine: { onZero: true },
          splitLine: { show: false },
          splitArea: { show: false }
        },
        yAxis: [
          {
            type: 'value',
            name: '数量',
            axisLabel: {
            }
          },
          {
            type: 'value',
            name: '环比增长率',
            min: 0,
            max: this.maxProportion,
            interval: this.maxProportion / 5,
            axisLabel: {
              formatter: '{value}'
            }
          }
        ],
        grid: {
          bottom: 140
        },
        series: [
          {
            name: '增幅',
            type: 'bar',
            stack: 'one',
            emphasis: emphasisStyle,
            data: this.data2,
            color: '#73C0DE',
            barWidth: '30px',
            itemStyle: {
              normal: {
                label: {
                  position: 'top'
                }
              }
            }
          },
          {
            name: '数量',
            type: 'bar',
            stack: 'one',
            emphasis: emphasisStyle,
            data: this.data1,
            color: '#91CC75',
            barWidth: '30px',
            itemStyle: {
              normal: {
                label: {
                  position: 'top'
                }
              }
            }
          },
        ],
        // 可为负值  data1 和 data2为数据
        data: (this.data1 || this.data2 || []).map((item) => {
          return {
            value: item,
            itemStyle: {
              normal: {
                label: {
                  show: true,
                  position: item > 0 ? 'top' : 'bottom',
                  textStyle: {
                    color: '#C23531',
                    fontSize: 12
                  }
                }
              }
            }
          }
        }),
      }, true);
    },