<div class="echart">
      <v-chart :options="polar" ref="echart" /> 1ref获取dom
    </div>


 .echart{ 2调整容器大小
      width: 100%;
      .echarts{
      width: 100%;
      }
    }

  mounted() {3 用echat的自适应resize方法 在 钩子函数中  覆盖 window的 resize方法
   window.onresize = () => {
      // (this.$refs['echart'] as any).$el.resize;
      (this.$refs['echart'] as any).resize()

      // console.log(8888888888888, this);
    };
  }
 

之前:有滚动条
在这里插入图片描述
之后:自适应
在这里插入图片描述
tip:

 window.onresize = () => {
      // (this.$refs['echart'] as any).$el.resize;
      (this.$refs['echart'] as any).resize()

      // console.log(8888888888888, this);
    };

    //  window.addEventListener("resize", () => { 

    // (this.$refs['echart'] as any).resize()
// console.log(8888888888888, this);这种绑定方式 拿不到this  所以 使用失败; 记得用  debug 调试!
    //   });
Logo

魔乐社区(Modelers.cn) 是一个中立、公益的人工智能社区,提供人工智能工具、模型、数据的托管、展示与应用协同服务,为人工智能开发及爱好者搭建开放的学习交流平台。社区通过理事会方式运作,由全产业链共同建设、共同运营、共同享有,推动国产AI生态繁荣发展。

更多推荐