vue大屏数据不显示，使用了echarts组件

Question

具体情况是这样婶儿的：
我是用vue做的大屏数据展示 封装的了几个echarts组件
刚开始数据是正常显示的 后来部分样式出了问题 就整改了一次
但是改过之后发现 图表的数据都不显示了 （数据什么的都能拿到）
后来发现 只要是我随便改一下echarts组件页面 数据就会出现
就算是你在某个地方换个行 或者是加一个console.log 保存的时候数据就会展示
但是只要一刷新 就又不展示了 绞尽脑汁的想了好多原因 试了好多方法
关键是不知道问题出在哪了 有没有知道是什么原因的

Answer 1

使用v-if控制组件，未获取到数据之前将v-if设置为false，获取到数据后设置为true

//html
<div id='echart' v-if='isShow'></div>

//js
export default {
  data() {
    return {
      isShow: false
    }
  },
methods: {
    getData() { //获取数据成功后
      this.isShow = true
    }
  }
}