ts+vue3项目的echarts二次封装

<script setup lang='ts'>
import { ref, watch, onMounted } from 'vue';
import * as echarts from 'echarts';
// 引入自定义ehcats样式的方法
import { getEchartsColor } from '../../utils/getColor';
// 接收父组件传递的数据
let props: any = defineProps({
    // Y轴的数据
    echartsY: {
        type: Array
    },
    // X轴的数据
    ehcartsX: {
        type: Array
    },
    // 标签的id
    ids: {
        type: String,
        default: 'main'
    },
    // 样式类型
    type: {
        type: Boolean,
        default: false
    }
})
// 初始化的数据
let myCharts: any = ref('')

// 使用watch来处理异步的数据,点击的内容发生改变,拿到新的数据渲染页面
watch(() => props, (val: any) => {
    getOption(val)
}, {
    deep: true,
})
// 自定义方法获取echarts数据
let getOption = (objs: any) => {
    let option = {
        xAxis: {
            // X轴显示的数据
            data: objs.ehcartsX,
            axisTick: {
                show: false // 不显示坐标轴刻度线