Given the sample code using ag-grid with Vue 3

<script setup lang="ts">
import "ag-grid-community/dist/styles/ag-grid.css";
import "ag-grid-community/dist/styles/ag-theme-alpine.css";
import { AgGridVue } from "ag-grid-vue3";
import { ref } from "vue";

const columnDefs = ref([
  {
    field: "person",
  },
  {
    field: "car",
  },
]);

const rowData = ref([
  {
    person: "person-1",
    car: "car-1",
  },
  {
    person: "person-1",
    car: "car-2",
  },
  {
    person: "person-1",
    car: "car-3",
  },
  {
    person: "person-2",
    car: "car-4",
  },
  {
    person: "person-3",
    car: "car-5",
  },
  {
    person: "person-3",
    car: "car-6",
  },
]);
</script>

<template>
  <ag-grid-vue
    style="width: 500px; height: 500px"
    class="ag-theme-alpine"
    :columnDefs="columnDefs"
    :rowData="rowData"
  >
  </ag-grid-vue>
</template>

You will get the following output

I could group the table based on person but is there a way to merge cells in a single column?

I think I can't use row-spanning for a single column definition because inside the rowSpan function it is not possible to tell ag-grid to combine multiple cells of a single column.

Any ideas?