vue3 统计饼图（echarts）

<script lang="ts" setup> import { ref, onMounted } from "vue";  import * as echarts from "echarts"; const main = ref(); // 使用ref创建虚拟DOM引用，使用时用main.value onMounted(() => {   init(); }); function init() {   // 基于准备好的dom，初始化echarts实例   const myChart = echarts.init(main.value);   const schoolData = [     {       name:'张三',       value:4253     },     {       name:'李四',       value:5691     },     {       name:'王五',       value:4536     },     {       name:'赵六',       value:4369     },     {       name:'周七',       value:5124     }]   // 指定图表的配置项和数据   const option = {     title: {       text: '个人存款',       left: 'center'     },     tooltip: {       trigger: 'item',       formatter: '<br/>{b} : {c} ({d}%)'     },     legend: {       orient: 'vertical',       left: 'left',       data: []     },     series: [       {         type: 'pie',         radius: '55%',         center: ['50%', '60%'],         data: [{ value: 335, name: '' }]       }     ]   }; // 赋值   option.series = [   {     type: 'pie',     radius: '55%',     center: ['50%', '60%'],     // data: res.data.map((v) => {     //   return { name: v.name, value: v.value }     // })     data: schoolData,   } ] // 赋值 // option.legend = [ //   { //    data: schoolData.map((a) => a.name) //   } // ] // 赋值 option.legend.data = schoolData.map((a) => a.name)    // 使用刚指定的配置项和数据显示图表。   myChart.setOption(option); } </script>  <template>   <div ref="main" style="width: 100%; height: 400px"></div> </template>