VUE 3 does not recognize dates and times (Composition API)

[GabrielAziz]

About

i'm working on a vue 3 project with typescript and i need the x axis to recognize in dates

I've tried in several ways, including creating data with new Date(), passing "2018-09-19T00:00:00" in categories and labels, Date.now, but nothing is recognized

I realized that everything in the composition API is more complicated, but unfortunately there is no way to escape it. I don't know if what I'm doing is wrong, if there's a right way to do this or if something is wrong.

What did I do:

I import the component

 import apexcharts from "vue3-apexcharts";

components: {
    apexcharts,
  }, 

I declare the information:

 const lineOptions = {
      chart: { id: 'total_of_professionals', type: 'line', height: 300, width: 400 },
      title: { text: 'Total de Profissionais', align: 'left' },
      markers: { size: 1},
      stroke: { width: 2, curve: 'smooth' },
      grid: { borderColor: '#F5F8FA' },
      xaxis: {
        type: 'datetime',
      },
      labels: ["2018-09-19T00:00:00", "2018-09-19T01:30:00", "2018-09-19T02:30:00", "2018-09-19T03:30:00", "2018-09-19T04:30:00", 
                   "2018-09-19T05:30:00", "2018-09-19T06:30:00"],
     colors: ['#00E396'] },
};

const series = {
      name: 'Profissionais', 
      data: [1,3,7,12,25,46,67,88]
} 

so I return:

return{
      options,
      series,
    } 

and use:

<div class="col-xs-12 col-lg-4">
       <apexcharts :options="options" :series="series"></apexcharts>
    </div>  

these are the versions in my package. json:

    "apexcharts": "3.23.1",
    "vue3-apexcharts": "^1.4.1",  

using new date

labels: [new Date("2019-03-12").getTime(), new Date("2019-03-17").getTime()],

[chiboreache]

"2022-05-22" date format works for me

[GabrielAziz]

"2022-05-22" date format works for me

Could you post your options please? and your package.json would also help, thanks :)

[chiboreache]

easy mate ;)

xaxis: {
    type: "datetime",
    categories: props.x_axis,
  }