echarts超出容器宽度解决办法

 

 出现echarts超出父盒子宽度的问题

在了解echarts绘制机制

echarts图形只绘制一次,且绘制时自动获取父级大小填写宽度

原代码
mounted () {
    // setTimeout(() => {
    this.$refs.GaugeChartBox.changeCpu()
    this.$refs.GaugeChartBox.changeMemory()
    this.$refs.GaugeChartBox.changeStorage()
    this.$refs.IPSECSessions.sessionsEcharts()
    this.$refs.IPSECFlow.flowEcharts()
    // }, 20)
  },

使用setTimeout

  mounted () {
    setTimeout(() => {
      this.$refs.GaugeChartBox.changeCpu()
      this.$refs.GaugeChartBox.changeMemory()
      this.$refs.GaugeChartBox.changeStorage()
      this.$refs.IPSECSessions.sessionsEcharts()
      this.$refs.IPSECFlow.flowEcharts()
    }, 20)
  },

 

posted @ 2022-05-31 17:28  Jim-vue  阅读(1480)  评论(0)  编辑  收藏  举报