feat:添加数据缓动效果

ZhangXianQiang

2024-03-13 2d6ec7162f446b64fe395a7e77894277b9385d96

 src/views/home/data-view/components/data-hola.vue

@@ -7,7 +7,7 @@
<script>
import * as echarts from 'echarts';
let holaChart = null;

let observer = null;
const config = {
  tooltip: {
    trigger: 'item'
@@ -78,6 +78,21 @@
        holaChart.setOption(config, true);
      }

    },
    // 监听变化
    observe() {
      if (!observer) {
        observer = new ResizeObserver(entries => {
          this.handleResize();
        })
      }
      observer.observe(this.$refs.hola);
    },
    // 窗口变换
    handleResize() {
      if (holaChart) {
        holaChart.resize();
      }
    }
  },
  watch: {
@@ -93,7 +108,15 @@
  mounted() {
    holaChart = echarts.init(this.$refs.hola);
    holaChart.setOption(config, true);
  }
    this.observe();

  },
  beforeDestroy() {
    if (holaChart) {
      holaChart.dispose();
      observer.unobserve(this.$refs.hola);
    }
  },
}
</script>