echarts在vue中title不生效

Question

<template>
<div id="echartsId" :style="echartsstyle"></div>
</template>

<script>
// 按需加载
import echarts from "echarts/lib/echarts";
import "echarts/lib/chart/bar";

export default {
props: {

echartsId: {
  type: String
},
echartsOption: {
  type: Object
},
echartsstyle: {
  type: Object
}

},
mounted() {

this.makeEcharts();

},
methods: {

makeEcharts() {
  // 基于准备好的dom，初始化_echarts实例
  let myChart = echarts.init(document.getElementById("echartsId"));
  // 指定图表的配置项和数据
  var option = {
    title: {
      show: true,
      text: "zxczxc",
      textStyle: {
        fontFamily: "Arial, Verdana, sans...",
        fontSize: 12,
        fontStyle: "normal",
        fontWeight: "normal",
        color: "#333"
      }
    },
    tooltip: {},
    legend: {
      data: ["销量"]
    },
    xAxis: {
      data: ["衬衫", "羊毛衫", "雪纺衫", "裤子", "高跟鞋", "袜子"]
    },
    yAxis: {},
    series: [
      {
        name: "销量",
        type: "bar",
        data: [5, 20, 36, 10, 10, 20]
      }
    ]
  };
  myChart.setOption(option);
}

}
};
</script>

Answer 1

是设了title后，zxczxc没有显示吗？
在官网的simple里是好使的。

---

然后我自己的vue项目里也是好使的。

html部分：

<div id="workChart" class="echart-div" v-show="switchStatus"></div>

js部分：

buildEChart.buildBarEChart("workChart");

然后EChart的部分：(省略了无关紧要大部分)

buildBarEChart(id) {
    const echart = EChart.init(document.getElementById(id));
    echart.setOption({
        color: ['#3398DB'],
        tooltip: ...
        xAxis:...
        yAxis: ...
        series: ...
    });
},