vue 引用echart

在Vue.js项目中引入ECharts，你需要先安装ECharts的依赖，然后在组件中导入并使用它。以下是基本步骤：

1. **安装ECharts**:
使用npm或yarn安装ECharts库：

   npm install echarts @vue/echarts --save
   # 或者使用 yarn
   yarn add echarts @vue/echarts

2. **注册组件插件**:
如果你在main.js或其他全局脚本中配置Vue，需要注册ECharts Vue插件：

   import { ECharts } from '@vue/echarts'
   Vue.use(ECharts)

3. **在组件中引用ECharts**:
在需要图表的组件里，通过`<template>`标签内的`<echarts>`元素来使用：

   <template>
     <div ref="chart" style="width: 600px;height:400px;"></div>
   </template>

   <script>
   export default {
     data() {
       return {
         chart: null
       }
     },
     mounted() {
       this.initChart()
     },
     methods: {
       initChart() {
         const myChart = this.$echarts.init(this.$refs.chart);
         // ...此处编写你的ECharts配置项和数据...
         myChart.setOption({
           // ECharts图表配置...
         });
       }
     }
   }
   </script>

4. **注意兼容性和配置**:
ECharts本身支持多种图表类型，你需要在初始化时传入合适的配置，并处理老版本的Vue或IE浏览器的兼容性问题。