[568] Server render error RangeError: Maximum call stack size exceeded

I got this error when I use v-for dynamic components on server side render. If data less then 10 records it's work fine and use client render it's work too. Error only use server side render. How do I solve?

<component v-for="element in dataItems" :is="element.name" :key="element.id"></component> here is my json data

[
  {
    "id": "1",
    "name": "Layout12"
  },
  {
    "id": "2",
    "name": "Layout12"
  },
  {
    "id": "3",
    "name": "Layout12"
  },
  {
    "name": "Layout12",
    "id": "4"
  },
  {
    "name": "Layout12",
    "id": "5"
  },
  {
    "name": "Layout12",
    "id": "6"
  },
  {
    "name": "Layout12",
    "id": "7"
  },
  {
    "name": "Layout12",
    "id": "8"
  },
  {
    "name": "Layout12",
    "id": "9"
  },
  {
    "name": "Layout12",
    "id": "10"
  }
]