vue3의 VueApexCharts 라이브러리에서 데이터가있는 배열을 차트로 올바르게 전달하는 방법은 무엇입니까?

작은 covid 프로젝트를 작성하고 ApexCharts를 사용하여 확인 된 감염 데이터를 플로팅하려고하는데 그래프가 표시되지 않습니다. vuex의 데이터를 두 개의 테이블에 입력합니다. 데이터는 유효하지만 프록시 개체의 api 및 sa에서 가져옵니다. 내가 도대체 ​​뭘 잘못하고있는 겁니까? (vue Chartjs가 vue 3과 호환되지 않기 때문에 ApexCharts를 사용하고 있습니다).

<template>
  <apexchart width="500" type="bar" :options="options" :series="series"></apexchart>
</template>

<script>
import VueApexCharts from "vue3-apexcharts";

export default {
  components: {
    apexchart: VueApexCharts,
  },
 data(){  
   return {
     series: [],
      options: {
        chart: {
          type: "bar",
          height: 400,
          stacked: true
        },
        plotOptions: {
          bar: {
            horizontal: false
          }
        },
        dataLabels: {
          enabled: false
        },
        tooltip: {
          shared: true,
          followCursor: true
        },
        stroke: {
          width: 1,
          colors: ["#fff"]
        },
        fill: {
          opacity: 1
        },
        legend: {
          position: "top",
          horizontalAlign: "center",
          offsetX: 40
        },
        colors: ["rgb(95, 193, 215)", "rgb(226, 37, 43)", "rgb(94, 181, 89)"]
      }
    };
 },
 computed: {
   getDate(){
     return this.$store.getters['chart/getDate'];
   },
   getConfirmed(){
    return this.$store.getters['chart/getConfirmed'];
   }
 },
   methods: {
    fillDate(){
       this.options = {
         xaxis: {
           categories: this.getDate
         }
       }
        this.series = [
         {
           name: 'Confirmed',
           data: this.getConfirmed
         }
       ];
     }
   },
  async mounted() {
    await this.fillDate();
  }
}

vuex 스토어의 데이터는 두 개의 배열입니다.

Proxy
[[Handler]]: Object
[[Target]]: Array(45)
[[IsRevoked]]: false