Can't create column groups via v-for loop

[jtuchel]

I'm submitting a ...

[x] bug report
[ ] feature request
[ ] support request

Based on the docs https://primefaces.org/primevue/showcase/#/datatable/colgroup I want to create dynamic column groups via code. When hardcoding the HTML everything works fine.

Working demo: https://codesandbox.io/s/proud-voice-myuxr

CodeSandbox Case (Bug Reports)

Demo showing the error: https://codesandbox.io/s/cool-snow-lrcg0?file=/src/DataTableColGroupDemo.vue

Current behavior
When trying to create the column groups via code I get the following error

Expected behavior
I would expect the same result as seen in the working demo. The column headers should look like

Minimal reproduction of the problem with instructions
Have a look at the file DataTableColGroupDemo.vue

What is the motivation / use case for changing the behavior?
If this is a bug it would be nice having this fixed to create dynamic column groups via code :)

Please tell us about your environment:

• OS: Linx/Win
• IDE: VSC
• Package Manager: npm

• Vue version: 3.1.5

• PrimeVue version: 3.8.2

• Browser: Checked with Chrome and Firefox

[tugcekucukoglu]

Duplicate #1630

[matthiashermsen]

@tugcekucukoglu I saw that you have already fixed the error on master ( a51f26c )

Do you know if there are any plans for a next release containing this fix any time soon? (v3.8.3)