The same Bar chart is displayed 3 times.

[hekep]

Description

The same Bar chart is displayed 3 times.
After some time milliseconds the second and 3rd copy are removed.

Sometimes 2nd and 3rd copy remain, until user zooms page in or out.

This hapneds both in Chrome and Firefox.

Quasar project.

Steps to Reproduce

<template>
  <q-page class="q-pa-md" style="">
    <div>
      <h1>Bar Graph attempt</h1>
    </div>

    <div>
      <apexchart
        width="500"
        type="bar"
        :options="myAppGraphDataOptions"
        :series="myAppGraphData"
      ></apexchart>
    </div>
  </q-page>
</template>

<script>
/**
 *
 */
import { ref, onMounted } from "vue";

import VueApexCharts from "vue3-apexcharts";

/**
 *
 */
import { Notify, Dialog } from "quasar";
/**
 *
 */
export default {
  name: "BarChart",
  components: {
    apexchart: VueApexCharts,
  },

  setup(props) {
    const myAppGraphData = ref([]);
    const myAppGraphDataOptions = ref({});

    /**
     * Registers a callback to be called after the component has been mounted.
     *  After the component has mounted into DOM:
     * @returns {undefined}
     */
    onMounted(() => {
      myAppGraphDataOptions.value = {
        chart: {
          id: "vuechart-example",
        },
        xaxis: {
          categories: [1991, 1992, 1993, 1994, 1995, 1996, 1997, 1998],
        },
      };

      myAppGraphData.value = [
        {
          name: "series-1",
          data: [130, 40, 135, 50, 49, 60, 70, 191],
        },
      ];

      // EOF yAppGraphData.value
    });

    return {
      myAppGraphData,
      myAppGraphDataOptions,
    }; //           EOF             return {
  }, //           EOF             setup(props) {
}; //           EOF              export default {
</script>

Expected Behavior

Display Bar chart only 1 time

Actual Behavior

Displayes bar chart 3 times

Screenshots

Reproduction Link

https://codesandbox.io/s/priceless-aryabhata-hit2h8?file=/src/pages/Index.vue

[drewbitt]

This would be an issue to open in https://github.com/apexcharts/vue-apexcharts

[Aegon95]

updated my app from Vue2 to Vue 3, now iam facing this issue

any workarounds for this?