Strange column duplication bug when using v-if="true" on both a custom column component and parent DataTable

Describe the bug

As suggested in the comments of https://github.com/primefaces/primevue/issues/4646, you can get a custom column component to work by setting v-if="true" on it. However, if you also set v-if="true" on the DataTable component it causes a very strange duplication bug where many of the columns are repeated.

This can actually be fixed by correctly setting up the dataKey but this was certainly not obvious! This bug also seems to occur with nested DataTables which is actually where I found it. Anyway, clearly something is not right with the custom column support and I figured I'd post this here in case anyone runs into the same issue.

Quick example of before and after adding v-if="true" to DataTable:

<DataTable :value="data">
  <Column field="name" header="Name"></Column>
  <Column field="location" header="Location"></Column>
  <MyColumn v-if="true" field="location" header="MyLocation"></MyColumn>
</DataTable>

<DataTable v-if="true" :value="data">
  <Column field="name" header="Name"></Column>
  <Column field="location" header="Location"></Column>
  <MyColumn v-if="true" field="location" header="MyLocation"></MyColumn>
</DataTable>

Reproducer

https://stackblitz.com/edit/primevue-4-ts-vite-issue-template-q73sbj?file=src%2FApp.vue

PrimeVue version

4.0.0-rc.3

Vue version

4.x

Language

TypeScript

Build / Runtime

Vite

Browser(s)

Firefox 127.0.2

Steps to reproduce the behavior

See the stackblitz.

Expected behavior

No response

primefaces / primevue