echarts报错'getAttribute' of undefined

发布于 2022-09-12 13:17:12 字数 1820 浏览 22 评论 0

$nextTick setTimeout destroyed()这些能用的都用了,还是不管用,依旧报错

image.png
image.png
之前是这样子的。但是他刷新会有问题就改了外层样式,使用百分比,再把echarts放进去就开始报错了。
image.png

html

<div class="main-cont">
      <a-row :gutter="16" class="cont-tone">
        <a-col :span="18">
          <div class="echarts-box">
            <div
          
              :style="{
                width: '100%',
                height: '324px',
                backgroundColor: '#f0fff9',
              }"
              ref="myChart2"
            ></div>
          </div>
        </a-col>
        <a-col :span="6">
        </a-col>
      </a-row>

js

  updated() {
    this.setChart4();
    this.setChart1(this.echartsData, this.cName);
    this.setChart2();
    this.setChart3();
  },
  mounted() {
    this.$nextTick(() => {
      console.log(this.$refs.myChart2); // 可以获取到
      this.setChart4();
      this.setChart1(this.echartsData, this.cName);
      this.setChart2();
      this.setChart3();
    });
    // setTimeout(()=>{
    //   this.setChart4();
    //   this.setChart1(this.echartsData, this.cName);
    //   this.setChart2();
    //   this.setChart3();
    // },50)
  },
  destroyed () {
    window.removeEventListener('resize', this.setChart2, 20)
  },
  
  
  methods: {
  // 柱形
    setChart2() {
      var myChart2 = this.$echarts.init(this.$refs.myChart2);
      window.addEventListener("resize", function() {
        myChart2.resize();
      });
      myChart2.setOption({
            // options
      });
    },
  }
  
  

如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。

扫码二维码加入Web技术交流群

发布评论

需要 登录 才能够评论, 你可以免费 注册 一个本站的账号。

评论(1

守不住的情 2022-09-19 13:17:12

这个错误就是没找到dom 也就是dom还没加载就执行了init

this.$refs.myChart2 这个打印出来了 需要看下 下面的方法
this.setChart4();里面有没有顺序写错的地方

~没有更多了~
我们使用 Cookies 和其他技术来定制您的体验包括您的登录状态等。通过阅读我们的 隐私政策 了解更多相关信息。 单击 接受 或继续使用网站,即表示您同意使用 Cookies 和您的相关数据。
原文