ECharts在vue3<script setup>中怎么使用

在Vue 3的`<script setup>`语法中，可以使用`defineProps`和`defineEmits`来定义props和emits，然后使用`ref`来定义响应式数据。

下面是一个简单的例子，展示如何在Vue 3的`<script setup>`语法中使用ECharts：

<template>
  <div ref="chart" style="height: 300px"></div>
</template>

<script setup>
import * as echarts from 'echarts';
import { defineProps } from 'vue';

const props = defineProps({
  option: {
    type: Object,
    required: true,
  },
});

const chart = echarts.init($refs.chart);
const chartOption = props.option;

chart.setOption(chartOption);
</script>

在上面的例子中，我们首先使用`defineProps`定义了一个props，props中包含一个`option`对象，这个对象是必需的。然后我们使用`ref`定义了一个响应式数据`chart`，并在`<div>`标签中使用`ref`引用了这个响应式数据。接着我们使用`echarts.init`初始化了一个ECharts实例，并使用`chart.setOption`设置了图表的配置选项。