refactor: 修改为setup形式

This commit is contained in:
dap 2025-03-23 13:30:40 +08:00
parent 731c9be4f1
commit ba6785931d
2 changed files with 122 additions and 142 deletions

View File

@ -1,22 +1,17 @@
<script lang="ts"> <script setup lang="ts">
import type { PropType } from 'vue';
import type { EchartsUIType } from '@vben/plugins/echarts'; import type { EchartsUIType } from '@vben/plugins/echarts';
import { defineComponent, onActivated, onMounted, ref, watch } from 'vue'; import { onActivated, onMounted, ref, watch } from 'vue';
import { EchartsUI, useEcharts } from '@vben/plugins/echarts'; import { EchartsUI, useEcharts } from '@vben/plugins/echarts';
export default defineComponent({ interface Props {
components: { EchartsUI }, data?: { name: string; value: string }[];
props: { }
data: {
default: () => [], const props = withDefaults(defineProps<Props>(), {
type: Array as PropType<{ name: string; value: string }[]>, data: () => [],
}, });
},
setup(props, { expose }) {
expose({});
const chartRef = ref<EchartsUIType>(); const chartRef = ref<EchartsUIType>();
const { renderEcharts, resize } = useEcharts(chartRef); const { renderEcharts, resize } = useEcharts(chartRef);
@ -61,12 +56,6 @@ export default defineComponent({
}; };
renderEcharts(option); renderEcharts(option);
} }
return {
chartRef,
};
},
});
</script> </script>
<template> <template>

View File

@ -1,20 +1,17 @@
<script lang="ts"> <script setup lang="ts">
import type { EchartsUIType } from '@vben/plugins/echarts'; import type { EchartsUIType } from '@vben/plugins/echarts';
import { defineComponent, onActivated, onMounted, ref, watch } from 'vue'; import { onActivated, onMounted, ref, watch } from 'vue';
import { EchartsUI, useEcharts } from '@vben/plugins/echarts'; import { EchartsUI, useEcharts } from '@vben/plugins/echarts';
export default defineComponent({ interface Props {
components: { EchartsUI }, data?: string;
props: { }
data: {
default: '0', const props = withDefaults(defineProps<Props>(), {
type: String, data: '0',
}, });
},
setup(props, { expose }) {
expose({});
const memoryHtmlRef = ref<EchartsUIType>(); const memoryHtmlRef = ref<EchartsUIType>();
const { renderEcharts, resize } = useEcharts(memoryHtmlRef); const { renderEcharts, resize } = useEcharts(memoryHtmlRef);
@ -85,12 +82,6 @@ export default defineComponent({
}; };
renderEcharts(options); renderEcharts(options);
} }
return {
memoryHtmlRef,
};
},
});
</script> </script>
<template> <template>