vue3中使用echarts

在Vue3中使用echarts可以通过以下步骤实现：

1. 安装echarts

npm install echarts --save

2. 在Vue3的组件中引入echarts

import * as echarts from 'echarts'

3. 创建一个div元素作为echarts的容器

<template>
  <div ref="echarts" style="width: 100%; height: 400px;"></div>
</template>

4. 在组件的`mounted()`生命周期中初始化echarts

mounted() {
  // 获取echarts容器的dom元素
  const container = this.$refs.echarts;
  // 初始化echarts实例
  const myChart = echarts.init(container);
  // 设置echarts的配置项
  const option = {...};
  // 渲染echarts
  myChart.setOption(option);
}

5. 在组件的`beforeUnmount()`生命周期中销毁echarts实例

beforeUnmount() {
  // 获取echarts容器的dom元素
  const container = this.$refs.echarts;
  // 销毁echarts实例
  echarts.dispose(container);
}

以上是在Vue3中使用echarts的基本步骤，具体的echarts配置和使用可以参考echarts官方文档。